挖空:单击“使用 foreach 参数绑定”

Question

所以，我有一个谷歌地图，上面有一些位置。我正在尝试在单击相应的列表项时过滤掉地图标记。我能让它工作的唯一方法是，如果我像这样输入标记标题的确切字符串：

<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)是行不通的。

这是我当前的观点模型：

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);
        }
    }
}

Answer 1

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