KnockoutJs中的條件數據綁定

我在<tbody>上有一個自定義綁定處理程序，如果用戶具有Viewmodel的適當權限，我只想應用它。此數據綁定允許用戶拖放表中的元素以重新排列列表。KnockoutJs中的條件數據綁定

如果滿足某些條件，是否可以有條件地數據綁定我的自定義綁定處理程序？

基本上我想：

<tbody data-bind="if (hasPermission){custom-binding: list}"></tbody>

是這種行爲可能與基因敲除實施？我認爲還有其他策略可以使用，例如有一個允許用戶對錶格進行排序的按鈕（只有當他擁有正確權限時才顯示），但我想檢查是否還有其他方法。

謝謝。

編輯

我不感覺良好的解決方案，我想出了，但它讓我得到我想要的結果：

 <!--ko if: hasPermission--> 
     <tbody data-bind="foreach: list, sortableList: list"> 
      @Html.Partial("_FilesTabTableBody") 
     </tbody> 
     <!-- /ko --> 
     <!--ko if: !hasPermission()--> 
     <tbody data-bind="foreach: list"> 
      @Html.Partial("_FilesTabTableBody") 
     </tbody> 
     <!-- /ko -->

基本上我只是複製在兩個地方的HTML ..這不是很漂亮，但它確實沒有工作。感謝大家的意見。

來源

2014-04-23 DJKempner

我只是想知道，編輯之後，如果用戶有權限，您是否知道serverside？因爲那樣你可以渲染合適的html服務器端。 –

這是一個很好的直覺。當用戶與列表進行交互時，hasPermission實際上會發生變化，所以我無法使用模板化HTML完成所有操作。雖然好想法！ – DJKempner

關於自定義綁定的好處是您可以完全控制。在你的自定義綁定中，你可以添加另一個參數來控制綁定的行爲。例如，你可以創建一個可見的綁定，只有榮幸當另一個觀察到的是真實的：

var vm = function() { 
    var me = this; 

    me.canChangeVisible = ko.observable(true); 
    me.showMessage = ko.observable(true); 
} 

ko.applyBindings(new vm());

HTML：

<div> 
    <div><input type="checkbox" data-bind="checked: canChangeVisible">Can Change Visible</input></div> 
    <div><input type="checkbox" data-bind="checked: showMessage">Show Message</input></div> 
</div> 
<div data-bind="makeVisible: showMessage, basedOn: canChangeVisible">Message</div>

在您自定義的結合，看看「支持算法FMP」，看它是否應該使用：

ko.bindingHandlers.makeVisible = { 
    update: function(element, valueAccessor, allBindings, viewModel, bindingContext) { 
     var bo = allBindings.get('basedOn'); 
     var canChange = bo == null ? true : ko.unwrap(bo); 
     if(canChange) 
      ko.bindingHandlers.visible.update(element, valueAccessor, allBindings, viewModel, bindingContext); 
    } 
};

這裏有一個完整的jsFiddle顯示這一點。「顯示消息」複選框的設置僅在選中「可以改變可見」的情況下使用。

來源

2014-04-23 16:47:45 PatrickSteele

這真的很聰明。謝謝一堆！ – DJKempner

使用計算..？

<tbody data-bind="custom-binding: safeList"></tbody> 

vm.safeList = ko.computed(function() { 
    if (vm.hasPermission) return vm.list; 
    return undefined; // or whatever you do when user has no permission 
});

來源

2014-04-23 15:50:46 danludwig

感謝您幫助我開始。自定義綁定使用jQuery UI來使表中的行拖放。我仍然有一個foreach綁定在該節點上枚舉所有行。如果我的自定義綁定處理程序用於undefined的，我相信它仍然允許用戶拖放行。 – DJKempner

在這種情況下，您可以爲您的foreach綁定進行另一次計算，在用戶沒有權限時返回空數組（或其他）。 – danludwig

您可以使用虛擬元素。

<!-- ko if: hasPermission --> 
<tbody data-bind="custom-binding: list"></tbody> 
<!-- /ko -->

來源

2014-04-23 15:54:26 Tomalak

感謝您的回覆。無論如何，我想保留節點，我只是不希望它在某些情況下具有該自定義綁定。 tbody還有一個數據綁定：foreach枚舉列表中的所有行。 – DJKempner

如果你的視圖模型不包含任何項目，如果用戶沒有權限看到它們，它將是最乾淨的。因此，無論如何，這是錯誤的做法。計算可能有效，但實際上你的API甚至不應該返回這些項目。混淆用戶不應該看到的東西並不是一個好策略。 – Tomalak

對不起，我想我們可能會缺少溝通。我想讓用戶看到這個列表中的元素，我只是不希望他們能夠重新排序它們，除非他們有權限。這是場景。 – DJKempner

KnockoutJs中的條件數據綁定

回答

相關問題