KO Expander バインディング

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

allowExpand
disabled
expandDirection
expanded

例：

この例では、エキスパンダと組み合わせて使用する ViewModel が定義されています。このビューには、disabled、allowExpand、expanded、および expandDirection プロパティがバインドされています。これらのいずれかの値が変更されると、ウィジェットは自動的にその変化に応答します。ウィジェットは、これらの値を変更する際に ViewModel の値も更新します。展開されたコンテンツはヘッダーの右側に表示されます。ヘッダーをクリックすると、展開されたコンテンツが非表示になります。

ViewModel の作成：

ViewModel スクリプト	コードのコピー
var viewModel = function () { var self = this; self.disabled = ko.observable(false); self.allowExpand = ko.observable(true); self.expanded = ko.observable(true); self.expandDirection = ko.observable('bottom'); };

ViewModel スクリプト

コードのコピー

var viewModel = function () {  
    var self = this;  
    self.disabled = ko.observable(false);  
    self.allowExpand = ko.observable(true);  
      self.expanded = ko.observable(true);         
      self.expandDirection = ko.observable('bottom');
};

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

ビューのマークアップ	コードのコピー
<div data-bind="wijexpander: { disabled: disabled, allowExpand: allowExpand, expanded: expanded, expandDirection: expandDirection }">

関連トピック

参照