如何在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指令

回答

相關問題