2013-12-20 14 views
12

私はAngularJS指令を持っています。私の指示は属性として使用することに制限されています。しかし、私は属性の値を取得したい。しかし、私は次のように属性を使用AngularJS指令値

angular.module('myDirectives.color', []) 
    .directive('setColor', function() { 
     return { 
      retrict: 'A', 
      link: { 
       pre: function() { 
        console.log('color is: '); 
       } 
      } 
     }; 
    }) 
; 

:::私は「色は」見るので

<button type="button" set-color="blue">Blue</button> 
<button type="button" set-color="yellow">Yellow</button> 

私は私のディレクティブが使用されていることを知っている現在、私は自分の属性として定義されています私はそのコンソールステートメントの最後に「青色」または「黄色」と表示させる方法を理解できません。私は条件付き処理を行うことができるようにその価値を得たいと思っています。属性の値を取得するにはどうすればよいですか?

ありがとうございました!

答えて

15

あなたは、リンク機能の属性引数を使用することができます。

angular.module('myDirectives.color', []) 
    .directive('setColor', function() { 
     return { 
      restrict: 'A', 
      link: { 
       pre: function (scope, element, attrs) { 
        console.log('color is: ' + attrs.setColor); 
       } 
      } 
     }; 
    }); 

か、このような分離株スコープ作成することができます。

angular.module('myDirectives.color', []) 
    .directive('setColor', function() { 
     return { 
      restrict: 'A', 
      scope: { 
       setColor: '@' 
      }, 
      link: { 
       pre: function (scope) { 
        console.log('color is: ' + scope.setColor); 
       } 
      } 
     }; 
    });