角更新範圍爲$表內的指令

比方說，我有兩個可拖動的元素

<div draggable enabled="false"></div> 
<div draggable enabled="false"></div>

要啓用/禁用我用以下指令的內容：

App.directive('draggable', function() { 
return { 
restrict:'A', 
link: function(scope, element, attrs) { 
    element.draggable(); 

    scope.$watch('enabled', function (val) { 
    element.draggable(val === true ? 'enable' : 'disable'); 

    }); 
} 
};});

我已經安裝$ watch看起來可以是真/假。現在我想用我的控制器來改變'enabled'屬性。

App.controller('TypeAheadController',function($scope){ 

//some code 
$scope.enabled = true; 
});

但是，當我使用這個，所有可拖動的元素被引用。所以他們都被啓用或禁用。我認爲這很奇怪，因爲我期望$ watch可以在每個可拖動元素的範圍內查找已啓用的值。我的目標是單獨啓用/禁用可拖動元素。所以我需要一種方法來設置/引用控制器中每個可拖動元素的enabled屬性。

來源

2014-10-20 Ray

您可以更改指令，有它自己的範圍：

App.directive('draggable', function() { 
    return { 
     restrict: 'A', 
     scope: { 
      enabled: '=' 
     }, 
     link: function (scope, element, attrs) { 
      element.draggable(); 

      scope.$watch('enabled', function (val) { 
       element.draggable(val === true ? 'enable' : 'disable'); 

      }); 
     } 
    }; 
});

爲了使您的控制器控制每個單獨的指令，你需要爲每個指令相應的配置：

App.controller('TypeAheadController', function ($scope) { 
    $scope.draggableItems = [{enabled:true},{enabled: true}]; 
});

和在您的HTML中：

<div ng-repeat="draggable in draggableItems" draggable enabled="draggable.enabled"></div>

來源

2014-10-20 18:27:39

如何從外部訪問本地範圍莫如？我需要將它設置在控制器內（就像我試圖用$ scope.enabled = true所做的那樣） – Ray 2014-10-20 18:33:28

@Ray我認爲潛在的問題與您將啓用的屬性綁定到Controller的功能有關屬性。如果你想讓每個指令都有它自己的'enabled'屬性，你需要爲每個指令使'enabled'成爲一個數組。 – 2014-10-20 20:36:24

「您需要爲每個指令將'enabled'變爲數組' 您會如何做到這一點？如果我在我的更新版本中使用隔離範圍，我對每個指令都有一個範圍。所以這很好，但是我不知道如何從指令外引用它。所以基本上，問題是，如何根據來自指令外部的條件設置可拖動的'enabled'。 – Ray 2014-10-20 21:31:23

角更新範圍爲$表內的指令

回答

相關問題