Wijmo UI for the Web
KO Carousel バインディング

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

例:

この例では、カルーセルと組み合わせて使用する ViewModel が定義されています。このビューには、disabled、showPager、および loop プロパティがバインドされています。これらのいずれかの値が変更されると、ウィジェットは自動的にその変化に応答します。ウィジェットは、これらの値を変更する際に ViewModel の値も更新します。ページャが表示され、画像を最初からループバックできます。

ViewModel の作成:

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

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

ビューのマークアップ
コードのコピー
<div data-bind="wijcarousel: {disabled: disabled, showPager: showPager, loop: loop}">  
  <ul>  
    <li><img src="http://lorempixum.com/750/300/sports/1" alt="Sports 1" /></li>  
    <li><img src="http://lorempixum.com/750/300/sports/2" alt="Sports 2"></li>  
    <li><img src="http://lorempixum.com/750/300/sports/3" alt="Sports 3" /></li>  
  </ul>  
</div>  

関連トピック

参照

 

 


Copyright © GrapeCity inc. All rights reserved.