2017-06-22 52 views
0

我試圖啓用一個按鈕後,檢查複選框,元素是在模態。我使用MVC,和我加入後主要結合的觀爲使用它們只是像莫代爾這個樣子的這裏面淘汰賽的綁定不工作啓用按鈕後ko.applyBindings在引導模式

<script type="text/javascript"> 
    var Model = function() { 
     self.check = ko.observable(false); 
    }; 

    $(document).ready(function() { 
     ko.cleanNode($('#Modal')[0]); 
     ko.applyBindings(Model, $('#Modal')[0]); 
    }); 

</script> 

HTML元素的模式:

<input type="checkbox" data-bind="checked:viewModel.check">bla bla.. 
<button type="button" data-bind="enable:viewModel.check==true" class="btn btn-primary">Delete</button> 

當我選擇複選框viewModel.check是真實的,什麼時候沒有被選中是假的,它工作正常,但是按鈕總是禁用。任何建議請

+0

應當'<按鈕類型= 「按鈕」 的數據綁定= 「啓用:viewModel.check」 類= 「BTN BTN-初級」>刪除'或'<按鈕類型=「按鈕「data-bind =」enable:viewModel.check()=== true「class =」btn btn-primary「> Delete'。因爲'check'是可觀察的。 – TSV

+0

當我嘗試這種方式時,我得到的消息不是函數,也許我沒有使用綁定的範圍:/ – UserEsp

+1

是的!第二個:)它應該是'ko.applyBindings(new Model(),$('#Modal')[0]);'' – TSV

回答

1

幾個問題...

取消實例化視圖模型

當調用ko.applyBindings,第一個參數必須是一個視圖模型實例。這意味着你需要在你的viewModel「class」上調用new

ko.applyBindings(new Model()) 

不正確的範圍,HTML

你引用一個viewModel變量,它不存在。在應用綁定時,它使用傳遞給in的viewModel的範圍來創建綁定上下文。這意味着您在HTML中可用的值與您的viewModel中的this相同。所以,只需使用check

enable結合結合至表達,無法觀測

使能綁定必須綁定到可觀察到的,但你有它必然要表達check==true。在這種情況下,check實際上是可觀察的 - this.check = ko.observable(),所以您最終比較的結果是function() { return true } == true,預計效果爲false。要對可觀測數據進行比較,您必須首先將它們作爲函數調用來打開它們:check() == true。但是,請注意,只要您正在編寫== true,您可能不需要:enable: check就是您最終想要的。

and a fiddle