Angular4：このコードを考えるとngFor

Question

に関数の結果にバインドする方法：これはFirebaseデータベースに接続されて

<div *ngFor='let loc of user.locations | async'> 
    <div *ngFor='let day of days'> 
     <div *ngFor='let data of get_data_observable(loc, day) | async'> 
      ... 
     </div> 
    </div> 
</div> 

。

get_data_observable(loc, day) => this.db.list(`/users/${this.auth.uid}/times/${loc.$key}/${day}`) 

私は新しい観測可能な大規模なパフォーマンスの問題を引き起こし、に最もngForたび角度のチェックを作成されていると信じています。 ngForが式ではなくget_data_observable(loc, day)の結果にバインドされるようにします。そして、それは変化しない1つの観測可能なものにサブスクライブしています。

この場合の最善の方法は何ですか？

Answer 1

これを解決するには、コンポーネントの中で最もngForを囲み、入力として関数の引数を与えます。引数そのものは決して変更されないので（反復ごとに）、最中の各項目に対して1つのオブザーバブルのみが作成されます。

<app-day [loc]='loc' [day]='day'></app-avail-day> 

そして

export class DayComp { 
    obs 
    @Input() loc 
    @Input() day 

    ngOnChanges(){ 
     this.obs = get_data_observable(this.loc, this.day) 
    } 
}