Question

我在一个.html文件中的两个不同的地方使用了相同的指令。我希望能够使用这两个指令使用不同的选项。以下是应该使此要求更加清晰的代码：

<ul multisortable="{ stop: 'updateFirstColumn', receive: 'receiveFirstColumn' }" 
    class='connected'>
        <li ng-repeat='task in tasks.firstcolumn> {{task.title}} </li>
</ul>


<ul multisortable="{ stop: 'updateSecondColumn', receive: 'receiveSecondColumn' }" 
    class='connected'>
        <li ng-repeat='task in tasks.secondcolumn> {{task.title}} </li>
</ul>

我想创建指令，它能够识别出，如果它是由第一列中的元素调用的，它应该使用为该元素定义的选项。所以我应该能够区分它，并获取updateFirstColumn或updateSecondColumn，例如，取决于是通过从第一列还是第二列移动项来调用它。

在我的指令中，在链接功能中我做了类似的事情：

link: function postLink(scope, iElement, iAttrs) {
   $timeout(function (){
     $scope.$watch('tasks', function(newValue, oldValue) {
         if (newValue){
              angular.element($element).multisortable({
                selectedClass: 'ui-selected',
                connectWith: '.product-backlog-column'
              })
         }   
     }, true);   
   }, 0);    
}

看起来我的指令总是只使用我从第二个元素传递的选项。我无法使用第一个或第二个元素的选项，具体取决于哪一个被拖动。

有没有人知道，为什么会这样？也许我应该在指令定义中定义单独的范围，或类似的东西？我尝试过很多东西，但没有运气。

感谢。

更新：

如果我删除$ watch和$ timeout，使用指令传递的选项工作正常，但我正在使用的jQuery调用工作不正常。我在控制器部分的指令中放置了jquery插件。

Answer 1

你的jquery插件可能正在做一些除了角度知识之外的事情。您将不得不执行$ apply（）以让angular知道更新。

要了解$ apply（）方法的工作原理，您可以在文档中找到它：http://docs.angularjs.org/api/ng.$rootScope.Scope#$apply

具有不同属性的相同指令

1 个答案: