1

Egghead.ioには、AngularJS のディレクティブの制限に関する優れた説明があります。カスタム ディレクティブは次のように定義できます。

angular.module("app", []).directive("blah", function () {
    return {
        restrict: "A",
        template: "blah directive. nothing to see here."
    };
});

これにより、この質問をする目的で、属性ディレクティブと呼ばれるものが作成されます( による)。restrict: "A"これは実際にはカスタム ディレクティブに対する Angular のデフォルトの制限であり、このディレクティブは次のように使用できます。

<div blah>
  <!-- content of directive -->
</div>

ただし、カスタム ディレクティブを作成する場合は、通常、次のような要素ディレクティブを使用します。

<blah>
  <!-- content of directive -->
</blah>

前者の属性ディレクティブが後者の要素ディレクティブよりも優れている点と、それがデフォルトとして選択された理由は何ですか?

4

3 に答える 3

5

これは私の意見です。

HTML でディレクティブを定義するには、属性、要素、およびクラスの 3 つの方法があります。クラスは緩すぎて混乱を招きます。ベスト プラクティスは、ロジックをスタイルから分離することです。要素ディレクティブは厳しすぎます。DOM 要素には「要素」ディレクティブを 1 つしか含めることができません。それは彼らを最初から特別なものにします。

属性は、これら 2 つの両極端の中間にあるように思われます。明らかに、1 つの要素で複数のディレクティブを使用できます (Egghead のビデオに従っている場合、「ディレクティブからディレクティブへの通信」に関するスーパーヒーローの例は、一種の「ディレクティブ階層」を示しています)。また、これはほとんどの場合非常に重要です (私はイントラネット アプリ用にプログラムしているので、私にはそうではありません) 属性により、angularJS テンプレートを有効な HTML にすることができます。

編集-私の2セントは、それが問題ではないということです-実際のシナリオでは、restrictオプションと同じくらい主要なものの「デフォルト」構成を信頼するのは悪い考えです-明示的に設定すると、明確で間違いなくディレクティブが作成されます(特にチーム プロジェクトで作業していますが、いつでも、本当に)

于 2013-05-08T18:55:34.410 に答える
3

Angular 1.3 では、デフォルトが「AE」に変更されました。https://docs.angularjs.org/api/ng/service/$compile#directive-definition-objectを参照してください。

「含める」ではなく「制限する」ため、変更されたと思います。したがって、「restrict」のデフォルトはほとんど制限しないはずです。

これは今後何を意味するのでしょうか -- 「restrict: 'E'」行が表示された場合、実際には「これは属性として使用されることを意図していませんでした」という意味であり、「単にしたい」という潜在的な現在の意味ではありません。これを要素として使用します。」

于 2015-04-16T23:17:43.477 に答える
0

これに対する私の見解は次のとおりです。

要素ベースのディレクティブは、ほとんどの場合、構造的な機能を表します。

たとえば、ポップアップ、ダイアログ、タブ付きウィジェット、および再利用可能なウィジェット全般に要素ベースのディレクティブを使用します。その後、それらに属性ベースのディレクティブを追加できます (ディレクティブに を追加するng-clickなど<ui-button>) が、要素名 (つまり、ディレクティブ名) は構築されるものの構造的なセマンティクスを表します。

于 2013-05-08T19:25:41.527 に答える