angularjs控制器和指令數據綁定不起作用

我有一個控制器和一個指令，我想要在對象上使用雙向數據綁定。該指令的目的僅僅是更新值。目前我沒有得到數據綁定正常工作，因爲在更新綁定變量時，onchange事件中div的背景顏色不會改變。另外，當我打開色輪時，車輪的值不是scope.activeColor。angularjs控制器和指令數據綁定不起作用

我的HTML看起來像這樣，它有一個指令和一個帶ng樣式的div。

<li ng-repeat="(key, color) in colors" ng-style="{'background': 'rgb(' + color.r + ',' + color.g + ','+ color.b}" ng-click="editColour(color)"> 
<div ng-style="{'background': 'rgb(' + activeColor.r + ',' + activeColor.g + ','+ activeColor.b}"></div> 

<input type="text" colorwheel value="currentColor">

在我的控制，我定義的對象：

$scope.editColour = function(colour) { 
    $scope.activeColor = colour; 
};

我的指令如下：

.directive('colorwheel', function() { 
     return { 
      restrict: 'A', 
      link: function(scope, element) { 
      var currentColor = 'rgb(' + scope.activeColor.r + ',' + scope.activeColor.g + ',' + scope.activeColor.b + ')'; 
      scope.currentValue = {color: currentColor}; 
      element.minicolors({ 
       control: 'wheel', 
       format: 'rgb', 
       inline: true, 
       opacity: false, 
       change: function(value, opacity) { 
       var rgb = element.minicolors('rgbObject'); 
       scope.activeColor.r = rgb.r; 
       scope.activeColor.g = rgb.g; 
       scope.activeColor.b = rgb.b; 
       console.log(rgb); 
       } 
      }); 
      } 
     }; 
    });

來源

2015-11-30 tester123

指令沒有定義任何數據綁定。請參閱http://stackoverflow.com/questions/14050195/angularjs-what-is-the-difference-between-and-in-directive-scope – Tristan

您可能需要在指令中觀察scope.activeColor，可以幫助您更好地執行你在這裏張貼小提琴或摘錄 – gaurav5430

您需要觀看activecolor變量的指令，使指令理解變量已更改

一個示例可以是

$scope.$watch('activeColor', function (newValue, oldValue) { 
        if (newValue) { 
         //do something with new value 
        } 
       });

來源

2015-11-30 21:39:39

angularjs控制器和指令數據綁定不起作用

回答

相關問題