AngularJS指令值

Question

我有一個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> 

我知道我的指令被使用，因爲我看到「顏色：」不過，我無法弄清楚如何在控制檯語句結尾顯示「藍色」或「黃色」。我想獲得這個值，所以我可以做一個有條件的處理。我如何獲得屬性的值？

謝謝！

Answer 1

您可以使用鏈接功能的屬性參數：

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); 
       } 
      } 
     }; 
    });