angular - 我应该订阅还是使用支持属性来更新组件中的依赖数据？

Question

我很难弄清楚 Angular 的最佳实践是什么。

我有以下问题：

<div>
   <app-child [data]="data | async"> 
   </app-child>
</div>

我应该执行以下操作：

A：使用 Backing 属性来更新相关的值

class ChildComponent{
     @Input 
     set data(value){
        this._data =value;
        this.label = this.labelService.getLabelColor(value.warningperiod)
     }
     get data(){ return this._data}
     _data: object;

     labelColor:string
     // constuctor... 
}

B：使用 Observables 和订阅

<div>
   <!-- pass down the whole observable -->
   <app-child [data]="data"> 
   </app-child>
</div>

class ChildComponent implements OnInit{
     @Input data: Observable<object>;
      labelColor: String;
      onInit(){
         this.data
         .subscribe( value =>{
              this.labemColor= this.labelService
.getLabelColor(value.warningPeriod)
          }) 
      }
      //constructor
     
}

什么是更好的？

当我订阅时，我需要取消订阅，这很“烦人”。

在什么情况下我应该做什么？

Answer 1

如果您不必修改异步数据，AsyncPipe这是最好的选择，因为您不必记住取消订阅（避免内存泄漏）并且检测更改将在后台完成。

如果你必须修改数据，在获取新数据后做一些操作，在这种情况下，订阅 .ts 更好，但你必须记住取消订阅，如果你设置ChangeDetectionStrategy.OnPush了你必须运行detectChanges。

所以，你应该AsyncPipe在大多数情况下使用，只有在你真正需要的时候才订阅。