angular.js - angularjs 操作 DOM は通常、命令またはサービスにどのように記述されますか?

Question

Angular を使用してコントローラーでデータ操作を実行すると、コードが肥大化して保守が難しくなります。何かベスト プラクティスはありますか?

Answer 1

ある意味または「合意」では、DOM 操作は命令内でのみ使用できます。あなたが最後にいるべき場所はサービス中です。 Angular はテスト駆動開発を推奨しています。サービスまたはコントローラーで DOM 操作が発生した場合、それはテストが合格できないことを意味します。もちろん、これは 1 点にすぎません。重要なことは、Angular を使用する利点の 1 つは双方向のデータ バインディングであり、山積みの DOM 操作に対処する必要がなく、ビジネス ロジックの処理に集中できるということです。 Angular コードに依然としてさまざまな DOM 操作が含まれている場合は、開発に jquery を直接使用してみてはいかがでしょうか。

私自身も役立つ例を書きました: https://github.com/dolymood/angular-example

Answer 2

単純にDOMを操作する場合は、DOMに対応するデータクラッドに関しては、テンプレートを介してコントローラーにバインドした後、コントローラー内で直接操作する方が良い場合があります。応答アニメーションをディレクティブでバインドし、コントローラーでイベントをブロードキャストして、ディレクティブ内の対応するアニメーションを制御します。これは、2014 年に angular を使い始めたときに検討した比較的完成度の高い angular プロジェクトです。とても勉強になりましたので、お役に立てれば幸いです。

https://github.com/atian25/wandoujia-satan

Answer 3

1. ビュー表示に関連するすべてのロジックはディレクティブ内に配置され、ディレクティブのみが dom を操作できます。
2. ページデータに関連するすべてのロジックは、ページにバインドされたコントローラーに配置されます。
3. すべての共通データロジックが稼働します。

Angular は実際、元々バックエンドで行われていたいくつかの作業ロジックをフロントエンドにもたらします。

典型的な例: todomvc とソースコード