データバインド viewmodel定義の可変

質問

knockout.jsで
データバンドを初めて実装しようとしているものです。

そこで、viewmodelの定義を可変に出来ないものか
調べてるのですが、ご教授願いますでしょうか。

HTML
<li data-bind="text : test1/></li>
<li data-bind="text : test2/></li>
<li data-bind="text : test3/></li>

通常js側は上記を埋め込む為に下記のように記述すると思いますが、
var viewmodel = {
test1: ko.obserbale(''),
test2: ko.obserbale(''),
test3: ko.obserbale(''),
}

定義のtest1～test3 の定義を可変化する事は可能でしょうか。
更にその可変化した定義に値を設定したいと考えてます。

したい事↓
for(var i=1; i<4; i++){
var viewmodel = {
test +i: ko.obserbal('');
}

test + i = i
}

ko.applyBindings(viewmodel);

配列等で対応した方がいいのでしょうか。

宜しくお願いします。

回答No.2

kaipu

>new ListViewModel("text1"),
>new ListViewModel("text2"),
>new ListViewModel("text3"),
>new ListViewModel("text4"),
>new ListViewModel("text5")
>こちらも可変にしたいと思ってるのですが、
>出来ないでしょうか。

text1～text5の部分を配列なりで持っているのであれば
ループ内でListViewModelを生成してあげれば良いと思います。

回答No.1

kaipu

こんな感じでどうでしょうか？

[html]
<ul data-bind="foreach:listItems">
<li><span data-bind="text:message"></span></li>
</ul>

[JavaScript]
function ViewModel(){
var self = this;
var items = [
new ListViewModel("text1"),
new ListViewModel("text2"),
new ListViewModel("text3"),
new ListViewModel("text4"),
new ListViewModel("text5")
];
self.listItems = ko.observableArray(items);
}

function ListViewModel(val){
var self = this;
self.message = ko.observable(val);
}

var viewModel = new ViewModel();
ko.applyBindings(viewModel);

補足

回答ありがとうございます。

参考にさせて頂きます。

new ListViewModel("text1"),
new ListViewModel("text2"),
new ListViewModel("text3"),
new ListViewModel("text4"),
new ListViewModel("text5")

こちらも可変にしたいと思ってるのですが、
出来ないでしょうか。