オブザーバブルのtodos bundのリストを持っていて、todosのいずれかを変更すると、すべてのアイテムが再レンダリングされますか?ngrx/storeのアイテムを変更してアイテムをレンダリングすると再レンダリングされる
1
A
答えて
0
角度2とngrx/storeで作成されたtodoプランナーが見つかりました。 変更されたアイテムだけがレンダリングされるのは、Webブラウザのdevtoolsで簡単に確認できます。その点で角度と反応は同じです。角度V2で
"plnkr.co/edit/Hb4pJP3jGtOp6b7JubzS?p=preview"
1
は、我々はコンポーネントステートフル(スマート)とStatlessの2種類があります。手段(ダム)
ステートフル:物事の仕組みに関係します。
統計情報:どのように見えるかに関係しています。
ChangeDetectionStrategy:
あなたがコンポーネントにどんな戦略を定義していない場合は、ChangeDetectionは常に「再放送」このコンポーネントになります。 戦略OnPushの場合、入力の変更があった場合のみ更新されますが、その場合はString、Number for Objects、ArraysのようなImmutablesに対してのみ機能します。
のでngrx /ストアとES6であなたは不変配列(ない唯一の方法)を作成することができ
ようcase ADD_TODO:
return [...state, action.payload];
case UPDATE_TODO:
return state.map(todo => todo.id === action.payload.id ? action.payload : todo);
その後、コンポーネントのドスとTODO
<todos [todos]="todosNgRx$ | async"></todos>
にこのコンポーネントが作成されますされますtodosのリストを取得し、2番目のコンポーネントをTodoに再描画します。
<todo *ngFor="let todo of todos" [todo] = "todo"></todo>
このコンポーネントはダムで、データのみを表示します。
ToDoの場合の更新のみが更新されるように、ChangeDetectionStrategy.OnPushを与える必要があります。また、新しいToDoを追加すると、ngForは新しいコンポーネントTodoになり、残りのリストは更新されません。
は、それがコードなし
関連する問題
- 1. React-Grid-Layout:サイズ変更時にアイテムを再レンダリングする方法
- 2. すべてのアイテムを再レンダリングせずにScrollViewにアイテムを追加する
- 3. Datagridアイテムのレンダリング
- 4. Reactは、1つのアイテムが変更されたときにリスト全体を再レンダリングする
- 5. 複数のアイテムをループしてそれぞれをレンダリングする
- 6. レンダリングされたアイテムの位置をアイテムの配列に追加しますか?
- 7. Angular2のパイプでJSONアイテムをレンダリングする
- 8. React-Redux:アイテムを削除しても配列は再レンダリングされません
- 9. 配列アイテムからHTMLをレンダリングする
- 10. リストのアイテムを変更するレンダリングはビューの状態に依存します
- 11. 角度v1.4は既にレンダリングされたアイテムを再レンダリングせずにdivを繰り返します
- 12. QMLアイテムへのOpenGLレンダリング
- 13. Selectize.jsアイテムのレンダリング角度ディレクティブ
- 14. 表示時にのみレンダリングするアイテム
- 15. 新しいアイテムを追加した後、ngRepeatはすべてのアイテムを再レンダリングしますか?
- 16. ReactネイティブListView - すべての表示アイテムがレンダリングされない
- 17. 異なる小道具と複数のアイテムをレンダリングするES6
- 18. Dom-Repeatレンダリング:実際には何ですか? dom-repeatにそのアイテムを再レンダリングする正しい方法は?
- 19. 親を再レンダリングすることなく親状態を変更しますが、子を再レンダリングします
- 20. ビュー内の個々のアイテムとコレクションをレンダリングする
- 21. ListViewアイテムがGridViewカラムにレンダリングされていない
- 22. 分離したプレースホルダーのアイテムをレンダリングする
- 23. ナビゲーションビューでアイテムが正しくレンダリングされない
- 24. bottomnavigationview変更アイテムをクリックするとフラグメントが再作成されます
- 25. liアイテムを並べてレンダリングする方法
- 26. アイテムの祖先が不透明度0の場合、アイテムをレンダリングさせることはできますか?
- 27. 動的にレンダリングされたアイテムでUIScrollViewのスクロールラグを削除する
- 28. プロパティが変更されたときにRebuild/Angular2コンポーネントを再レンダリングします
- 29. のRails:部分コレクションをレンダリング:私は部分的にレンダリングしたいアイテムのコレクション
- 30. Vue.js 2.0同じコンポーネントが1つのアイテムにレンダリングされますが、他のアイテムは表示されません
が、あなたがデモでPlunkrを投稿することができた場合、 – Maxime
さらに良い...あなたを助けることは困難になるだろうと私は間違いなくあなたを伝えること:) – Maxime
をした場合ことができますホープ私はコードを持っていましたが、私は自分のために見ることができました( - :私は新しい/変更されたアイテムを描くだけで反応しますが、Angularは同じことをすることができます) –