Knockout visible綁定使用方法_基礎知識

簡單的綁定

首先還是先定義一個ViewModel

複製程式碼

複製程式碼

複製程式碼



複製程式碼

複製程式碼

程式碼如下:    var AppViewModel = {        shouldShowMessage: ko.observable(true)  AppViewModel.shouldShowMessage = ko.observable(false);   ///現在hidden勒    ko.applyBindings( AppViewModel);

並且透過ko.applyBindins進行啟用Knockout。
然後定義一個UI介面元素

複製程式碼


程式碼如下:

程式碼如下:

    You will see this message only when "shouldShowMessage" holds a true value.

此運行時候還是顯示的可以，之後就被重新賦值為false,導致此div被隱藏掉了。
參數：
當參數設定為一個假值時（例如：布林值false，數字值0， 或null， 或undefined） ,此綁定將設定該元素的style.display值為none，讓元素隱藏。它的優先權高於你在CSS裡定義的任何display樣式。
當參數設定為一個真值時（例如：布林值true，或非空non-null的物件或陣列） ,該綁定會刪除該元素的style.display值，讓元素可見。然後你在CSS裡自訂的display樣式將會自動生效。
如果參數是監控屬性observable的，那麼元素的visible狀態將根據參數值的變化而變化，如果不是，那麼元素的visible狀態只會設定一次且以後不在更新。
使用函數或表達式來控制元素的可見性
你也可以使用JavaScript函數或表達式作為參數。這樣的話，函數或表達式的結果將決定是否顯示/隱藏這個元素。例如：




複製程式碼

程式碼如下:

    ko.applyBindings ( AppViewModel);

在ViewModel中加入了一個myValues的屬性值
同時為myValues的陣列新增了一個項目

並且在頁面UI中綁定了一個元素

複製程式碼 程式碼如下:

    　　You will see this message only when 'myValues' has at least one member.

就這樣添加🎜>0 則結果為true 那麼此div就會顯示出來。