knockout.js - 淘汰赛js $index（）绑定不起作用

Question

我正在使用 KnockOut JS 创建一个 DataGrid 和一个寻呼机。

寻呼机是这样的：

<ul class="grdPager" data-bind="foreach: new Array(StudentGridSettings().totalPages)">
    <li><a href='#' data-bind="click: function() {TurnStudentListPage($index()+1)}, text: ($index()+1), style: { color : ($index()+1) == StudentGridSettings().pageIndex ? 'black' :'blue'} "></a></li>
</ul>

Dashboard.TurnStudentListPage(i) 是一个改变 Dashboard.StudentGridSettings().pageIndex 值的函数。其他一切正常。但是，当页面更改时，链接的颜色不会改变。即使 pageIndex 发生变化，只有第一个 li 变为黑色，其余部分保持蓝色。

提前致谢。

Answer 1

如果您更改可观察 KO 内的属性值，则不会收到通知。因此，即使您StudentGridSettings是可观察的，如果您编写StudentGridSettings().pageIndex = somethingKO 也不会知道StudentGridSettings已更改，因此它不会更新您的绑定。

您可以使用该方法触发绑定valueHasMutated，因此您需要将其更改TurnStudentListPage为：

self.TurnStudentListPage = function(index){
    self.StudentGridSettings().pageIndex = index; 
    self.StudentGridSettings.valueHasMutated();
}

演示JSFiddle。

或者只是将您的pageIndex属性声明为ko.observable并在您的绑定中使用：

data-bind="style: { color : ($index()+1) == StudentGridSettings().pageIndex() ? 'black' :'blue'}"

演示JSFiddle。