ディレクティブのAngular JSに1つのパラメータを渡す方法は？

Question

Angular JSでカスタムディレクティブを書く方法を学びます。私が最初のステップをした：

.directive("myClass", function(){ 
    return function (scope, element, attributes){ 
      // HERE TO GET PARAMETER AND COMPARE 
    } 
}); 

<div my-class="value"></div> 

私はswitch caseとディレクティブでこれを確認し、クラス名を返した後、my-classをディレクティブにパラメータを渡すvalueしてみてください。

この値はどのようにして取得できますか？

Answer 1

ディレクティブにパラメータを渡す方法はいくつかあります。 Directive Guideを参照してください。

Directive Definition Objectでscopeプロパティを使用する方法の1つは、値をリンク関数で使用できるようにすることです。

もう一つの方法は、あなたが属性を記録し、すべての利用可能なものを見るようにしてくださいディレクティブ で指定されたパラメータにアクセスするための属性を使用することができますあなたのケースでは、属性
を使用しています。

あなたはパラメータがディレクティブに値を渡す

.directive("myClass", function($parse){ 
    return function (scope, element, attributes){ 
      // HERE TO GET PARAMETER AND COMPARE 
      console.log(attributes); 
      console.log($parse(attributes.myClass)); 
    } 
}); 



<div my-class="value"></div> 

Answer 2

戻り値が正しくありません。これは次のようになります。

Answer 3

最も簡単な方法は、「ディレクティブ

angular.module("app",[]) 
 
.directive("myClass", function(){ 
 
    return { 
 
      restrict : 'A', 
 
      scope : { 
 
      myValue : '@' 
 
      }, 
 
      link : function (scope, element, attributes){ 
 
       console.log(scope.myValue) 
 
      } 
 
     } 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script> 
 
<div ng-app="app" > 
 

 
    <div my-class my-value="value"></div> 
 
</div>