我有一个子组件,它列出表中的数据(通过父组件的数据绑定传入),以及每行上的删除按钮 . 单击删除按钮时,我想调用异步服务从数据源中删除该行,并在删除时显示进度指示器 . 我想出了一些方法来解决这个问题,并希望从工程/最佳实践/可维护性/性能角度看看哪些方面最有意义,或者是否有另一种更好的方法 .

以下是该场景的一些示例代码:https://stackblitz.com/edit/angular-wxvwip和我提出的解决方案:

  • 我的首选解决方案:在子组件上添加数据绑定以管理父组件管理的指示符可见性,并使用子组件中的EventEmitter通知父操作 . 如果需要在删除后进行其他逻辑,也可以在子节点中使用ngOnChanges() . 可以更改数据模型以组合数据和进度数组 .

https://stackblitz.com/edit/angular-wxvwip-kt9g92

  • 也将服务注入子组件,并在订阅开始/结束之前/之后显示/隐藏指示符 .

https://stackblitz.com/edit/angular-wxvwip-qkzw5b

  • 使用EventEmitter发出一个事件,该事件包含一个跟踪操作状态的标志的对象 . 孩子将进度指示器的可见性绑定到此标志 . 只要完成,父组件就会将此标志设置为false .

https://stackblitz.com/edit/angular-wxvwip-9xcceg