Kendo MVVM - 綁定到整個視圖模型

我有一種情況，我想觀察視圖模型的行爲，因爲我正在填充表單。我可以通過定義很多類似於模型的字段並綁定到這些字段來做到這一點，但那樣很麻煩。Kendo MVVM - 綁定到整個視圖模型

我目前正在用下面的代碼完成此操作;

(function ($) { 
    $.printJSON = function(value){ 
     return JSON.stringify(value, undefined, 2); 
    } 
})(jQuery); 

var viewModel = kendo.observable({ 
        // other fields etc 
    update: function (e) { 
     e.preventDefault(); 
     $("#json_result").html($.printJSON(this)); 
    } 
}); 


<div style="width: 400px; float: left; padding-left: 15px;" > 
    <button data-bind="click: update" value="Update" >Update</button> 
    <pre id="json_result"> 
    </pre> 
</div>

因此，您單擊按鈕，它運行的功能繪製視圖模型JSON到屏幕，都很好，並格式化。

但是，這仍然需要點擊按鈕。雖然這對我來說並不是什麼大問題，但由於這並非我在很多情況下所需要的，是否有任何方法可以實際執行此操作並在視圖模型以任何方式更改時進行更新？我試圖綁定到該函數，它不會更新沒有明確的調用，我嘗試綁定視圖模型的權利，也沒有工作。

來源

2013-11-03 Ciel

你既可以簡單地綁定change事件：

viewModel.bind("change", function (e) { 
    $("#json_result").html($.printJSON(this)); 
});

或者你可以使用一個計算字段：

var viewModel = kendo.observable({ 
    field1: "field1", 
    field2: "field2", 
    field3: "field3", 
    print: function() { 
     // need to register for all fields so that the change event for print is triggered 
     for (var fieldName in this) { 
      if (this.hasOwnProperty(fieldName)) { 
       this.get(fieldName); 
      } 
     } 

     return $.printJSON(this.toJSON()); 
    } 
});

，並綁定到它：

<pre data-bind="html: print">

見小提琴展示兩種方法：http://jsfiddle.net/lhoeppner/S2WeB/

來源

2013-11-04 05:32:08

Kendo MVVM - 綁定到整個視圖模型

回答

相關問題