問題タブ [angularjs-track-by]

For questions regarding programming in ECMAScript (JavaScript/JS) and its various dialects/implementations (excluding ActionScript). Note JavaScript is NOT the same as Java! Please include all relevant tags on your question; e.g., [node.js], [jquery], [json], [reactjs], [angular], [ember.js], [vue.js], [typescript], [svelte], etc.

0 投票する
1 に答える
1855 参照

angularjs - 「ng-options」の「track by」の目的は何ですか

ng-optionsAngular 1.3 を使用する場合の trackexpr (track by) の目的は何ですか?

Angular 1.2 では、この式value=""は生成されたオプションの式を変更して、コレクション内の各アイテムの trackexpr の結果と一致させました。これは、この jsfiddle: http://jsfiddle.net/3fzkym3m/によると、Angular 1.3 には当てはまりません。現在、オプションには増分値があります。

Angular 1.2 では、生成されたオプション リストは次のとおりです。

Angular 1.3 では、生成されたオプション リストは次のとおりです。

ソース コレクションと選択されたアイテムの間でオブジェクトを照合するために、Angular はまだトラック バイを使用していますか? これを行うことによるパフォーマンス上の利点はまだありますか? Angular 1.2 と 1.3 の間でこれが変更されたのはなぜですか?

0 投票する
1 に答える
784 参照

javascript - ng-repeat track by が機能していません: 遅く、まだ $$hashKey を生成しています

次のように ng-repeat を設定しています。

main[main.mode].primaryは配列で、…<code>.filter.order は文字列です。

このブログ記事によると

バックグラウンドで ngRepeat は各タスクに $$hashKey プロパティを追加して追跡します。元のタスクをサーバーからの新しいタスク オブジェクトに置き換えると、それらが実際には元のタスクと完全に同一であっても、それらは $$hashKey プロパティを持たないため、ngRepeat はそれらが同じ要素を表していることを認識しません。

リストの再生成は非常に一般的なタスクであり、アプリが 1 秒以上ハングしているため、追跡することに関心があります。私が見た多くの質問とドキュメントによると、配列の順序付けと追跡の両方に正しい構文を使用しました。ドキュメントから:

アイテム中のアイテム | filter:searchText track by item.id は、追跡式と組み合わせてアイテムにフィルターを適用するために使用できるパターンです。

トラックが実装されていないのはなぜですか?私はAngular 1.3.11を実行しています。

編集 orderBy 引数を削除しても機能しません

0 投票する
3 に答える
24864 参照

angularjs - 複数のプロパティによるトラックを使用したng-repeat

angular ng-repeat ディレクティブに問題があります。現在、APIからアイテムのリストを取得するプロジェクトに取り組んでおり(1kアイテムになる場合もあります)、このリストは5秒ごとに更新する必要があります(関連プロジェクトを監視しています)。

リストの長さが少し大きくなると、DOM の再レンダリング中に Web サイトが「遅くなる」可能性があります。angularがDOM全体を再生成することがわかります(ただし、アイテムの95%は同じです!)

可能なアプローチの 1 つは、たとえば item.id に「追跡」式を設定することです。しかし、ここで別の問題が発生します。たとえば、説明が他のユーザーによって変更されたときにアイテムを再生成したいです。track by は item.id への式であるため、item.description の変更は DOM のアイテムを更新しませんでした。

複数のプロパティで追跡する方法はありますか? たぶん何かの機能?それとも「手」で比較しますか?

任意のアイデア、コード サンプルをいただければ幸いです :)

アップデート

トラックをitem.id angularに設定したときに発見したことは、アイテムのhtmlを再作成せず、既に作成された要素の値を更新するだけで、削除して作成するよりも「速い」ようです。以前は少し違いましたが。

修理

ng-repeat USE track by item.idで 1,000個を超えるアイテムのパフォーマンスを向上させたい場合は、パフォーマンスが向上します;)

0 投票する
1 に答える
288 参照

javascript - Angular: 「追跡」する必要があるが、追跡する固有のプロパティがない場合はどうしますか?

これは、とプロパティng-repeatimages持つオブジェクトの配列です。srccaption

画像が重複している可能性があるため、src+のcaption組み合わせは一意性を保証しません。したいのですがtrack by、 以外に方法がないようです$index

$index私には悪い解決策のようです。最初の画像 (a) が削除されたとします。その後、後続のすべての画像のインデックスが変更されるため、リスト全体を再レンダリングする必要があります。これは、10 個の項目のリストではそれほど悪くありませんが、より大きなリストではそうです。

  1. 考え?

  2. また、src+が一意であることが保証されてcaption いたらどうでしょうか? どうすればtrack by複数のプロパティを取得できますか?

  3. track by追跡されたプロパティをに置くことで機能します$$watchersか? のようtrack by image.idなことをしてい$scope.$watch(image.id, cb)ますか?

0 投票する
1 に答える
220 参照

angularjs - AngularJS orderBy が trackBy で機能しない

orderBy が trackBy で機能しない理由がわかりません。気が狂いそうです :(

ここに私のHTMLコードがあります:

順序を逆に変更しても、毎回同じ結果が得られます

そしてここに私のAngularJSコード:

さらにコードが必要な場合はお知らせください

0 投票する
1 に答える
2223 参照

javascript - ng-options で使用される配列を更新し、選択したオブジェクトを更新します

angular では、Track by を使用して、参照ではなく値で選択を追跡することは、必要に応じて優れた機能です。しかし、配列を後ろに切り替えて、選択したオブジェクトIDが新しいIDと一致するとしましょう。選択も変更したい

再評価を強制するにはどうすればよいですか?

HTML:

JS:

を選択Id 2して更新すると、selectedObjectはまだ古いid:2 value:0ので、直接 に変更したいとしid:2 value:200ます。

https://jsfiddle.net/IngoVals/p4ye3uaq/

angular.copyPSなぜフィドルで動作しないのですか?

0 投票する
1 に答える
552 参照

angularjs - Angular ngOptions 'track by' と null 値の検証の問題

ngOptions を使用した選択リストと、次のような「追跡」機能があります。

コード オブジェクトには、コードの有効性を決定する開始日と終了日など、さまざまなプロパティがあります。コードを選択できるかどうかを確認するために使用される別の「日付」プロパティがあります。このvaliddate-directiveにはオブジェクト全体が必要なので、track byを使用し、「as」を使用してng-modelプロパティを埋めることはできません。

これは、初期の null 値を除いて、適切に機能します。

検証が false を返し (それに応じて選択ボックスをマーク)、ユーザーが null 値を選択すると、検証はリセットされません。

ng-model プロパティ 'code' がオブジェクトから null 値に変更されても、バリデータは呼び出されません。追跡のため、検証ディレクティブをトリガーしないようです。誰かがこれに対する解決策を知っていますか?