Question

我试图通过将属性名称分配给变量来尝试更改我过滤的属性，但它无法正常工作。有没有办法在不编写自己的过滤器的情况下完成此操作？ codepen

<div ng-app="app" ng-controller="main as m">
  <input ng-model="keyword"/>
  <p>Property: {{m.property}}</p> <!-- resolves to 'name' -->
  <!-- does not work-->
  <div ng-repeat="o in m.objects | filter:{m.property:keyword}">
    {{o.name}}
  </div>
  <hr/>
  <!-- works-->
  <div ng-repeat="o in m.objects | filter:{name:keyword}">
    {{o.name}}
  </div>
</div>

Answer 1

如果我理解你的问题，我认为this正是你要找的。

相关代码：

HTML：

<select ng-model="property" ng-change="clearSearch()">
  <option>name</option>
  <option>age</option>
  <option>city</option>
</select>

<input ng-model="search[property]" />

<div class="box">
  <div class="item" ng-repeat="item in data | filter:search">
    {{item.name}} | {{item.age}} | {{item.city}}
  </div>
</div>

使用Javascript：

var app = angular.module("myapp", []);
app.controller("main", function($scope){
  $scope.search = {};
  $scope.clearSearch = function(){
    $scope.search.name = "";
    $scope.search.age = "";
    $scope.search.city = "";
  }
  $scope.property = "name";
  $scope.data = [
      {
        name: "Robert",
        age: 23,
        city: "Orem"
      },
      {
        name: "Alice",
        age: 44,
        city: "Nephi"
      },
      {
        name: "Susan",
        age: 12,
        city: "Odgen"
      },
      {
        name: "Henry",
        age: 63,
        city: "South Jordan"
      },
      {
        name: "Frank",
        age: 35,
        city: "Provo"
      },
      {
        name: "Albert",
        age: 32,
        city: "Payson"
      },
  ];
});

Answer 2

简而言之，<div ng-repeat="o in m.objects | filter:{m.property:keyword}"> {m.property：keyword}不正确expression

Answer 3

你是否尝试过没有“m”的过滤器。在“m.property”？

<div ng-repeat="o in m.objects | filter:{property:keyword}">

过滤器中对象的AngularJS范围变量

3 个答案: