Knockout：单击与Foreach参数绑定

Posted 2021-05-05

所以，我有一些谷歌地图与一些位置。当您单击相应的列表项时，我正在尝试将地图标记过滤掉。我可以让它工作的唯一方法是，如果我把标记标题的确切字符串放入：

<tbody data-bind="foreach: filteredItems()">
    <tr data-bind="click: toggleGroup('Michi Ramen')">
        <td id="listTitle" data-bind="text: $data.title"></td>
    </tr>
</tbody>

当然，这会使每个列表项过滤精确的事情。放toggleGroup.bind($data.title)不起作用。

这是我当前的viewModel：

var viewModel = function(data) {
    var self = this;
    self.filters = ko.observableArray(data.filters);
    self.filter = ko.observable('');
    self.shops = data.shops;
    self.filteredItems = ko.dependentObservable(function() {
        var filter = self.filter().toLowerCase();
        if (!filter) {
            return self.shops();
        } else {
            return ko.utils.arrayFilter(self.shops(), function(Shop) {
                return Shop.title().toLowerCase().indexOf(filter) !== -1;
            });
        }
    }, viewModel);
};  

这是我用来尝试过滤标记的功能。

function toggleGroup(title) {
    var i;
    for (i = 0; i < markers.length; i++) {
        var marker = markers[i];
        if (marker.title === title) {
            marker.setVisible(true);
        } else {
            markers[i].setVisible(false);
        }
    }
}

答案

我的猜测是title是一个observable，所以你需要做click: toggleGroup.bind($data, $data.title())。或者click: function(data, event) { toggleGroup(data.title()) }。