angle2のパイプを通過した後のビューの値を更新するには+

Question

購入するアイテムが表示されたショッピングカートのチェックアウトビューを書いています。

*ngFor="let x of shoppingarray"

は、私は、ユーザーに最後の最後で、リストに複数の項目を追加する可能性を与えたい何とか合計は私がアレイと小計を更新していても更新されません。

配列内のオブジェクトに直接影響する数量をインクリメントすることで、配列の小計を更新します。

（component.ts） AddmoreItemsOFThistype(a){ this.shoppingarray[a].qt += 1; }

そしてIは、パラメータとしてインクリメント量でx.qtを与えるパイプを通して各小計を通過させることにより、各小計を再計算します。 （パイプがちょうどx.price * x.qtを乗算）

（component.html） {{x.price|totalPerItem:x.qt}}

問題は、世界全体がフィルターから返された値を更新しないことです。

{{shoppingarray|CalculateTotalpipe}}

CalculateTotalpipeはちょうどループのすべての合計を加算し、全体の配列は、何とか最初の合計がcorrrectですが、小計への変更は有効になりません。

CalculateTotalpipeが更新された合計を生成するようにshoppingarrayを更新する方法はありますか？

もっと良いアプローチがありますか？

ありがとうございます！

Answer 1

Andresは、不純なパイプの使用には注意してください。

角度はすべての成分変化 検出サイクル中に不純なパイプを実行します。それは文書で書かれているよう 多くの場合、毎回 キーストロークまたはマウス移動のように、不純なパイプが頻繁に呼び出されます。

これは、ユーザーがマウスを動かすかページをスクロールするたびに、合計金額が再計算されることを意味します。 これにより、パフォーマンスの問題が発生します。

パイプを使用せずにトータルを実装する別の方法を見つけることをお勧めします。なぜ単純なサービスを使用しないのですか？