Angular 4中如何获取数组内指定元素的count值？

首先你当前代码没输出的核心问题是引号嵌套冲突：HTML属性本身用双引号包裹ng-repeat的值，里面的字符串"science"又用双引号，会导致浏览器解析错误。哪怕只是匹配单个值，也得把内部双引号改成单引号，比如filter: {name: 'science'}。不过要实现匹配science或article的需求，有两种更合适的方案：

方案一：自定义过滤函数（灵活通用） #

在控制器里定义一个过滤函数，用来判断当前item的name是否符合要求：

// 控制器代码
$scope.data = [{"name":"science", count: 3}, {"name":"action", count: 1}, {"name":"thriller", count: 1}, {"name":"article", count: 1}];

$scope.filterTargetNames = function(item) {
  // 返回匹配science或article的项
  return item.name === 'science' || item.name === 'article';
};

然后在HTML中使用这个函数作为过滤器：

<span ng-repeat="item in data | filter: filterTargetNames"> {{ item.count }} </span>

方案二：使用数组匹配（AngularJS 1.3+支持） #

如果你的AngularJS版本是1.3及以上，可以直接用数组指定多个匹配值，写法更简洁：

<span ng-repeat="item in data | filter: {name: ['science', 'article']}"> {{ item.count }} </span>

这种方式会自动匹配name等于数组中任意一个值的项。

另外补充：如果只是想获取单个匹配项的count（比如只想拿science的count），不需要用ng-repeat，可以直接这样写：

{{ (data | filter: {name: 'science'})[0].count }}

内容的提问来源于stack exchange，提问作者pinks