Knockout.js Как получить доступ к $index в функции обработчика

Как я понимаю, $index доступен внутри привязки foreach:, указав индекс объекта... У меня есть привязка click:, например. click:foo, мне нужно получить доступ к $index внутри foo.

Есть ли способ?

Ответы

Ответ 1

да,

<input type="button" data-bind="click: function(data, event) { myClickHandler($index, data, event); }"/>

Ответ 2

Вместо того, чтобы взломать его через функцию внутри вашей привязки, вам просто нужно получить контекст привязки. До тех пор, пока у вас есть доступ к элементу DOM, связанному с привязкой, вы можете получить контекст привязки и все его свойства с помощью функции ko.contextFor().

Объект события, который вы получаете в своем обработчике, дает вам доступ к node через свойство target. Возьмите контекст, используя это.

var viewModel = {
    foo: function (data, event) {
        var context = ko.contextFor(event.target);
        // do stuff with context.$index()
    }
};

Ответ 3

Это проще с кодом ES6. В моем html у меня есть массив страниц

<span data-bind="foreach: pages">
     <a data-bind="click: $parent.gotoPage.bind($parent), text: $index()+1">
     </a>
</span>

В классе контроллера представления у меня есть метод gotoPage. Первым параметром будет индекс $ foreach. Очень просто.

class ViewModel {
    constructor() {
        this.requestedPage = ko.observable(0);
        this.pages = ko.observableArray([0,1,2,3]);
    }

    async run() {
        this.message("Running");
    }

    gotoPage(pageRequested, event) {
        this.requestedPage(pageRequested);
        this.run();
    }
}