Question

这应该是一件非常简单的事情。我正在构建一个带有JSON数据文件的IONIC应用程序。数据是这样的。

[
  { "id": 1,
    "name": "John",
    "type": "male",
    "bio": "this is John"
  },
  { "id": 10,
    "name": "Mary",
    "type": "female",
    "bio": "this is Mary"
  }
]

现在我想通过数据中的“type”进行过滤，然后按“id”循环数据。

<ion-list ng-repeat="person in people | filter:   {'type': 'male'}">
  <ion-item href="#tab/people/males/{{ person.id }}">{{ person.name }}
</ion-item>
</ion-list>

控制器是：

.controller('PeopleController', ['$scope', '$state', '$http', function($scope, $state, $http){
$http.get('data/people.json').success(function(data){
$scope.people = data;
$scope.whichPerson = $state.params.id;
}),
}])

仅按名称显示男性所需的数据。

但是，如果我想使用以下代码查看单个生物

<div class="card" ng-repeat="person in people | filter: { id: whichPerson }">
<h2>{{ person.name }}</h2>
<p>{{ person.bio}}</p>
</div>

当我点击每个人的单独项目来展示person.bio时，我得到John和Mary。'

我认为这是因为“id”是1和10，它似乎正在解析为控制器的字符串。我试过把这个

"id": "1" and "id": "10"

没用。我在控制器中做到了这一点

$scope.whichPerson = parseInt($state.params.id, 10);

这也不起作用。我完全难过了。如何从数据中获取个人ID？事实上，我注意到我可以将id更改为11或12或13等，它仍然会返回两个记录？

任何帮助表示感谢。

Answer 1

尝试按照documentation中的说明将比较器:true添加到过滤器中。这会强制严格比较过滤器值，而不仅仅是检查数据是否包含它。

Answer 2

鉴于上述情况不起作用，您可以通过以下方式尝试自定义过滤器：

filter: { id: whichPerson }:sameID

然后在你的控制器中：

$scope.sameID = function(actual, expected) {
        return parseInt(actual) === parseInt(expected)
    };

即使这不起作用，您也可以至少在自定义过滤器中进行调试，以查看比较失败的位置

Ionic从JSON数据中获取整数ID

2 个答案: