我填充使用KnockoutJS数组列表:
<div data-bind:"foreach: list">
<input type="text" data-bind="value: myText" />
</div>
function ViewModel() {
self.list = ko.observableArray([
new listItem("sample text")
]);
};
function listItem (text) {
this.myText = text;
};
我可以分配一个id,我输入的,像这样的单个实例
<input data-bind="attr: { id: $index } ...
如何从我的listItem函数内访问该指数? 我希望能够像做
function listItem (text) {
this.myText = text;
this.index = $index;
};
为了使用这个用于进一步处理。
您可以创建一个自定义绑定,你的属性设置为索引,它看起来是这样的:
ko.bindingHandlers.setIndex = {
init: function(element, valueAccessor, allBindings, data, context) {
var prop = valueAccessor();
data[prop] = context.$index;
}
};
这是假设你正在处理您的数组中的对象。 你会使用它,如:
<ul data-bind="foreach: items">
<li data-bind="setIndex: 'myIndex', text: name"></li>
</ul>
所以,这个副本的$index
上与您指定的属性名称的对象观测。 示例: http://jsfiddle.net/rniemeyer/zGmcg/
你可以做到这一点的绑定之外(这是我如何使用前做的另一种方式$index
)是订阅更改observableArray每次重新填充的索引。
这里是一个扩展的observableArray可能是什么样子:
//track an index on items in an observableArray
ko.observableArray.fn.indexed = function(prop) {
prop = prop || 'index';
//whenever the array changes, make one loop to update the index on each
this.subscribe(function(newValue) {
if (newValue) {
var item;
for (var i = 0, j = newValue.length; i < j; i++) {
item = newValue[i];
if (!ko.isObservable(item[prop])) {
item[prop] = ko.observable();
}
item[prop](i);
}
}
});
//initialize the index
this.valueHasMutated();
return this;
};
那么你可以使用它像:
this.myItems = ko.observableArray().indexed('myIndexProp');
下面是一个示例: http://jsfiddle.net/rniemeyer/bQD2C/
文章来源: KnockoutJS: Access index of item in array from within the JavaScript template