我的淘汰赛数据绑定产生未定义的控制台错误答案

【问题标题】：My Knockout Data Bind is Producing an Undefined Console Error我的淘汰赛数据绑定产生未定义的控制台错误
【发布时间】：2019-05-05 19:07:51
【问题描述】：

我正在使用 Knockout 过滤两个下拉菜单，但我不知道为什么会看到此控制台错误。

Uncaught TypeError: Unable to process binding "value: function(){return $root.filter }" 消息：无法读取未定义的属性“长度”

问题与返回值有关，它正确过滤了数据；但是，控制台错误不断出现，我尝试更改以下内容：

将$root 更改为$data
将filter.Value 更改为filter.ID()
去掉括号，只返回ID，到现在什么都没用？

JS/淘汰赛：

    var self = this;
    self.filters = ko.observableArray(self.Model.Teams());
    self.filter = ko.observable('');
    self.items = ko.observableArray(self.Model.Users());
    self.filteredItems = ko.computed(function () {
        var filter = self.filter();
        if (!filter || filter == "All") {
            return self.items();
        } else {
            return ko.utils.arrayFilter(self.items(), function (i) {
                return i.ID() == filter.Value();
            });
        }
    });

此选择下拉菜单：

<div>
        <select class="filter-dropdown-small" data-bind="options: $root.filters, value: $root.filter, optionsText: 'Text', optionsCaption: 'All'"></select>
</div>

过滤这个：

<div>
       ```<select class="filter-dropdown-small" data-bind="options: $root.filteredItems, optionsText: 'Text', optionsCaption: 'All'"></select>```
</div>

要过滤的数据没有控制台错误。

【问题讨论】：

标签： javascript knockout.js

【解决方案1】：

因为 $root.filter 被用在另一个注入到这个 HTML 中的部分中，这是一个冲突导致控制台错误，重命名 JS 的过滤器部分，因此在第一段 html 上绑定了数据，这解决了控制台错误，因此问题。

【讨论】：