Question

我想通过点击相关的类别名称复选框来过滤问题。例如：如果仅选中类别X复选框，则仅显示类别X的问题。

我可以将名称Cat1，Cat2等直接绑定到catfilters对象：

    <input type="checkbox" ng-model="catfilters.Cat1" /> Cat 1
    <input type="checkbox" ng-model="catfilters.Cat2" /> Cat 2

    <ul>
        <li ng-repeat="q in questions | bycategory:catfilters">{{q.question.cat_id}}</li>
    </ul>

这很有效。

但是，我想从控制器的列表中动态创建类别复选框，并将它们绑定到catfilters对象：

    $scope.cats = [
        'Cat1',
        'Cat2',
        'Cat3'
    ];

    //c is 'Cat1', 'Cat2', etc...
    <div ng-repeat="c in cats">
        <input type="checkbox" ng-model="catfilters.c">{{c}}</span>
    </div>

    <ul>
        <li ng-repeat="q in questions | bycategory:catfilters">{{q.question.cat_id}}</li>
    </ul>

但由于某种原因，这不会应用过滤。我虽然没有收到任何错误。

注意：我也尝试按索引属性查找：

<div ng-repeat="c in cats">
    <input type="checkbox" ng-model="catfilters[c]">{{c}}</span>
</div>

这也不起作用

过滤：

angular
    .module('DDE').
        filter('bycategory', function() {
            return function (questions, categories) {

                var items = {
                    categories: categories,
                    out: []
                };

                angular.forEach(questions, function (value, key) {
                    if (this.categories[value.question.cat_id] === true) {
                        this.out.push(value);
                    }
                }, items);
                return items.out;
            };
        }
    );

Answer 1

catfilters.c会在c中查找名为catfilters的属性，无论您在其他地方是否有变量c。

请尝试通过索引属性catfilters[c]进行查找。

//c is 'Cat1', 'Cat2', etc...
<div ng-repeat="c in cats">
    <input type="checkbox" ng-model="catfilters[c]">{{c}}</span>
</div>

Answer 2

我做了plunkr。我使用

实现

     <div ng-repeat="input in inputs">
      <input type="text" ng-model="filter[input]">
     </div>

和

     $scope.inputs = ['foo','bar'];
       $scope.filter={
         'foo':"Foo",
         'bar':"Bar"
        }

它工作正常（我认为与您的方案类似）。您的实现中必定存在错误。

动态绑定到ng-model过滤器

2 个答案: