KO Editor バインディング

データバインディングのオプション：

disabled
editorMode
mode
showFooter
showPathSelector

例：

この例では、エディタと組み合わせて使用する ViewModel が定義されています。このビューには、disabled、editorMode、showPathSelector、showFooter、および mode プロパティがバインドされています。これらのいずれかの値が変更されると、ウィジェットは自動的にその変化に応答します。ウィジェットは、これらの値を変更する際に ViewModel の値も更新します。このエディタは分割モードで表示されます。エディタとコードの両方が表示され、単純なツールバーが表示されます。

ViewModel の作成：

ViewModel スクリプト	コードのコピー
var viewModel = function () { var self = this; 　self.disabled = ko.observable(false); 　　　self.editorMode = ko.observable('wysiwyg'); 　　　self.showPathSelector = ko.observable(true); 　　　self.mode = ko.observable('ribbon'); 　　　self.showFooter = ko.observable(true); };

ViewModel スクリプト

コードのコピー

var viewModel = function () {  
    var self = this;  
      　self.disabled = ko.observable(false); 
        　　　self.editorMode = ko.observable('wysiwyg'); 
        　　　self.showPathSelector = ko.observable(true);
        　　　self.mode = ko.observable('ribbon'); 
        　　　self.showFooter = ko.observable(true); 
};

バインドコントロールを使用したビューの作成：

ビューのマークアップ	コードのコピー
<textarea data-bind="wijeditor: {disabled: disabled, editorMode: editorMode, mode: mode}" style="width: 756px; height: 475px;"> <h1> JavaScript</h1> <p> <img src=http://cdn.wijmo.com/images/200px-JavaScript-logo.png alt="JavaScript-logo.png" height="200" width="200" style="float: left; margin: 10px"> JavaScript is a prototype-based scripting language that is dynamic, weakly typed and has first-class functions. It is a multi-paradigm language, supporting object-oriented, imperative, and functional programming styles. </p> </textarea>

ビューのマークアップ

コードのコピー

<textarea data-bind="wijeditor: {disabled: disabled, editorMode: editorMode, mode: mode}"  
  style="width: 756px; height: 475px;">  
<h1> JavaScript</h1> 
<p> 
<img src=http://cdn.wijmo.com/images/200px-JavaScript-logo.png 
alt="JavaScript-logo.png" height="200" width="200" 
style="float: left; margin: 10px"> 
JavaScript is a prototype-based scripting language that is dynamic, 
weakly typed and has first-class functions. It is a multi-paradigm language, 
supporting object-oriented, imperative, and functional programming styles. </p>  
</textarea>

関連トピック

参照