如何在angular-ui中动态禁用ui-sortable指令

我正在使用ui-sortable指令对angular-ui进行排序。是否可以基于范围状态动态地启用/禁用可排序的功能？所以我需要有一个按钮来改变范围属性的状态，并根据这个属性排序或者应该工作或不工作。如何在angular-ui中动态禁用ui-sortable指令

来源

2013-04-22 Alexander Kalinovski

我的第一次尝试将包括一个新的directive带有链接功能，compiles模板片段包含或不包括基于某范围内的某些值的可排序的模板片段。

当我有时间的代码。

来源

2013-04-24 02:04:00 andy

您可以使用ui-if在ui-sortable版本和不可排序版本之间切换，但这是一个可怕的设计。但是，如果您签出jQuery Sortable Docs似乎有disabled的选项。如果该指令目前正在监视选项对象以进行更改，则可以简单地切换此选项。如果选项对象是通过引用而不是按值来监视的，那么也许你应该通过调整来打开一个拉取请求？

来源

2013-05-04 08:50:17 ProLoser

角指令支持看，当排序选项改变：

scope.$watch(attrs.uiSortable, function(newVal, oldVal){

因此，所有你需要做的就是看看jQueryUI的排序文档，并更新插件正确的属性。

的Html

<ul ui-sortable="sortableOptions" ng-model="items"> 
    <li ng-repeat="item in items">{{ item }}</li> 
</ul> 
<button ng-click="sortableOptions.disabled = !sortableOptions.disabled">Is Disabled: {{sortableOptions.disabled}}</button>

app.controller('MainCtrl', function($scope) { 
    $scope.items = ["One", "Two", "Three"]; 

    $scope.sortableOptions = { 
    disabled: true 
    }; 
});

来源

2013-07-17 21:15:19

感谢您的回答杰森！这真的有帮助！ – Whizkid747 2013-11-18 19:36:55

这在angular-ui v0.4.0中似乎不是这种情况。在sortable.js中搜索scope。$ watch不会返回任何结果。编辑：在亭亭玉立的角度版本似乎过时了！ – 2013-12-20 17:14:59

重新链接已损坏。这将是非常好的，如果你可以分享另一名plunker – 2016-02-18 13:16:32

HTML

<div class="group-container" ui-sortable="vm.groupSortable" ng-model="group.groups">

vm.groupSortable = { 
    connectWith: ".group-container", 
    disabled: true 
}; 

vm.disableDragAndDrop = function(bVar) 
{ 
    vm.groupSortable.disabled = bVar; 
};

来源

2017-01-31 04:56:25 pradipgarala

如何在angular-ui中动态禁用ui-sortable指令

回答

相关问题