AngularJS使用Ng-Repeat按属性过滤不工作答案

【问题标题】：AngularJS filter by property using Ng-Repeat NOT workingAngularJS使用Ng-Repeat按属性过滤不工作
【发布时间】：2014-10-22 14:20:41
【问题描述】：

我有一个 ng-repeat，它正在成功地重复数据。现在，我想按我在输入框中输入的属性过滤结果。但是，它要么根本不起作用，要么如果我尝试各种事情，有时什么都不会显示。正如您所看到的，这是一项正在进行的工作，我已经尝试了很多不同的东西：因此为什么我的代码不一致！请不要对此发表评论，因为它不具有建设性！

             <tr ng-if="vm.detail == true">
                    <th><input type="text" ng-model="filter.TrusteeCustNum" /></th>
                    <th><input type="text" ng-model="filter.MchNumber" maxlength="4" class="input-    sm form-control" /></th>
                    <th><input type="text" ng-model="filter.ContractNumber" class="input-sm form-control" /></th>
                    <th><input type="text" ng-model="vm.PlanCode" maxlength="10" class="input-sm form-control" /></th>
                    <th><input type="date" ng-model="filter.PlanStatusDate" /></th>
                    <th><input type="text" ng-model="filter.PlanStatus" /></th>
                    <th><input type="date" ng-model="filter.PlanEffectiveDate" /></th>
                </tr>
            </thead>
            <tbody>
                <tr ng-repeat="plan in vm.PlanCodeInfo | filter: vm.PlanCode | orderBy:     vm.PlanCode" ng-if='vm.detail == true && vm.detailPlanCode'>
                    <td> {{plan.TrusteeCustNum}}</td>
                    <td>{{plan.CustomerNumber}}</td>
                    <td>{{plan.ContractNumber}}</td>
                    <td>{{plan.PlanCode }}</td>
                    <td>{{plan.PlanStatusDate | date: 'yyyy-MM-dd'}}</td>
                    <td>{{plan.PlanStatus}}</td>
                    <td> {{plan.PlanEffectiveDate | date: 'yyyy-MM-dd'}}</td>
                    <td><a href="">Rates</a></td>
                    <td><a href="">State Availability</a></td>
                </tr>

如何获得任何过滤器来按我正在使用的属性过滤结果并按这些属性对它们进行排序？

【问题讨论】：

标签： javascript html angularjs filter ng-repeat

【解决方案1】：

如果你想按属性过滤PlanCode 那么过滤器应该是一个具有指定属性的对象：

ng-repeat="plan in vm.PlanCodeInfo | filter:filterObj"

在 HTML 中，您使用相应的ngModel 定义过滤器输入。当然，您可以使用多个属性进行过滤。这是PlanCode 和PlanStatusDate 过滤器的示例：

<input type="text" ng-model="filterObj.PlanCode">
<input type="text" ng-model="filterObj.PlanStatusDate">

【讨论】：

我只是在输入这个
我首先尝试了 g-repeat="plan in vm.PlanCodeInfo | filter:filter"。但是，这不会让任何东西显示出来。我只是用这一行绕过它：

【解决方案2】：

您的 $scope 中是否存在 vm.PlanCode？您是否尝试过用“planCode”之类的简单名称替换它并添加 $scope.planCode = '';到你的 $scope？

只是看看它是否有影响？

查看您的模型/范围会很有帮助。

【讨论】：

是的，我试过了。另外，我知道 planCode 在我的范围内，因为我对其进行了调试并查看了 $scope 中的内容。不过，我想知道，如果过滤器不能应用于一行？它是否必须在标签上？

【解决方案3】：

filter: filter.PlanCode 是我需要按 planCode 过滤的代码。另外，我必须将 ng-model 更改为 filter.PlanCode。

【讨论】：