AngularJSは、ユーザー定義のタグプロパティをサポートし、DOMノード操作を使用せずにカスタムコンテンツを追加します。
Angularjsの4つの主要な特徴が前に言及されています。
1 MVC
2モジュラー
3つの指示
4双方向データバインディング
以下が紹介されます。
1コマンドをカスタマイズする方法
2カスタム命令の使用
3カスタムディレクティブのインライン使用
ディレクティブをカスタマイズする方法：
Angularはモジュールベースのフレームワークであるため、独自のモジュールを作成する必要があります。
var myAppmodule = angular.module（ "myApp"、[]）;
次に、このモジュールにディレクティブを作成します
myAppmodule.directive（ "xingoo"、function（）{return {restrict： 'aecm'、template： '<div> hello my directive </div>'、置換：true}}）;その中でも、Xingooはカスタムタグの名前で、その後のメソッド関数が続きます。
この関数は、タグの使用方法、プロパティなどを定義するキー価値ペアの組み合わせを返します。
それが定義するものを見てみましょう：
1制限：タグの使用方法を定義し、合計4つのタイプ、つまりAECM
2テンプレート：タグのテンプレートを定義します。内部には、カスタムタグを置き換えるために使用される文字列があります
3交換：交換をサポートするかどうか
4 TransClude：組み込みをサポートするかどうか
コマンドの使用方法：
上記の4つの方法、つまりAECM。
属性：属性として使用されます
<div xingoo> </div>
E要素：ラベル要素として使用されます
<xingoo> </xingoo>
Cクラス：CSSスタイルとして使用
<div> </div>
mコメントコメント：コメントとして使用されます（この方法はバージョン1.2では利用できません！）
<！ - ディレクティブ：xingoo->
<div> </div>
一般的に言えば、属性と要素として使用することをお勧めします。
既存のHTMLタグに属性を拡張する場合は、属性メソッドを使用します。
タグをカスタマイズするときは、タグの形を取ります。
その方法を使用するには、定義指令の制限に対応する文字を宣言する必要があります。
指令のインライン使用：
他のタグをタグ内にネストできるため、カスタムタグに他の要素タグをネストする場合は、次のことが必要です。
1 Trueに設定されたTransCludeプロパティを使用します。
2そして、ng-transcludeプロパティを使用して、内部ネストされた場所を定義します。
コードは次のとおりです。
myAppmodule.directive（ "test"、function（）{return {restrict： 'aecm'、translate：true、テンプレート： "<div> haha！<div ng-transclude> </div> wuwu！</div>"}}）;すべてのコード
<！doctype html> <html ng-app = "myapp"> <head> <meta http-equiv = "content-type" content = "text /html; charset = utf-8" /> <スクリプトsrc = "http://apps.bdimg.com/libs/angular.js/1.2.16/Angular.min.js"> </scrip> </head> <body> xingoo> </xingoo <xingoo> 3333 </xingoo> <hr> <test> 4444 </test> <script type = "text/javascript"> var myappmodule = angular.module（ "myapp"、[]）; myAppmodule.directive（ "xingoo"、function（）{return {restrict： 'aecm'、template： '<div> hello my directive </div>'、置換：true}}）; myAppmodule.directive（ "test"、function（）{return {restrict： 'aecm'、transclude：true、template： "<div> haha！<div ng-transclude> </div> wuwu！</div>"}}）; </script> </body> </html>実行結果
上記は、AngularJSカスタムディレクティブを整理する情報です。今後も関連情報を追加し続けます。このサイトへのご支援ありがとうございます！