【问题标题】:Find object by its property in array of objects with AngularJS way使用AngularJS方式在对象数组中通过其属性查找对象
【发布时间】:2017-03-11 10:55:36
【问题描述】:

我有一个像下面这样的数组

var myArray = [{'id':'73','name':'john'},{'id':'45','name':'Jass'}, etc.]

现在我有一个id 73 如何从数组中选择这个特定对象。我看到我可以使用 grep 在 jQuery 中轻松做到这一点。有没有 angular 方式 这样做?

由于大多数使用 angular 开发应用程序的用户总是从对象数组(主要用于表格)中获取数据,因此应该有一个辅助函数吗?

这样我就可以通过更新对象数组来改变行的ID与行的数据。

我不想在视图中绑定这个。我想操作数据并使用函数更新数据。

例如。我有一个表格清单。如果最终用户从表中编辑一行,我有对象的 ID,所以在最终用户点击保存后,我需要更新数组,然后返回表列表。

【问题讨论】:

  • @JaredSmith 我正在为此寻找任何角度辅助函数(如 angular.isNumber),而不是 javascript 默认数组对象方法。
  • 这完全没有意义。为什么需要一个框架辅助函数来替换一直支持到 IE 9 的本机方法?除非您另外说明原因,否则它只会被视为 XY 问题meta.stackexchange.com/questions/66377/what-is-the-xy-problem
  • 如果您已经在使用 Angular,我可以理解为什么您不想包含 jquery,但 .filter 既是原生的,也得到了很好的支持。如果你能给出一个令人信服的理由为什么角度和角度单独,必须被用来解决这个问题,我会撤回接近投票。
  • OP 想要一个angularjs 的答案。目标骗子没有回答这个问题。就像 jQuery 解决方案不回答 javascript 问题一样。

标签: javascript angularjs arrays


【解决方案1】:

对我有用的解决方案如下

$filter('filter')(data, {'id':10}) 

【讨论】:

    【解决方案2】:

    要获得完整的M B 答案,如果您想访问已经从 HTML 中的数组中过滤出来的该对象的特定属性,您必须这样做:

    {{ (myArray | filter : {'id':73})[0].name }}

    因此,在这种情况下,它将在 HTML 中打印john

    问候!

    【讨论】:

      【解决方案3】:

      纯 JavaScript 怎么样? More about Array.prototype.filter().

      var myArray = [{'id': '73', 'name': 'john'}, {'id': '45', 'name': 'Jass'}]
      
      var item73 = myArray.filter(function(item) {
        return item.id === '73';
      })[0];
      
      // even nicer with ES6 arrow functions:
      // var item73 = myArray.filter(i => i.id === '73')[0];
      
      console.log(item73); // {"id": "73", "name": "john"}

      【讨论】:

      • 感谢 +1 的帮助。我已经看到了JavaScript过滤方法,我正在寻找角度方式。
      • 改用FIND怎么样?
      • @Dementic find 支持在编写答案时在 Chrome 中仍然很新鲜,例如在 IE 中根本不可用。另一方面是filter
      • IE ?那是什么 ? :)
      【解决方案4】:

      你可以使用 Angular 的 filter https://docs.angularjs.org/api/ng/filter/filter

      在您的控制器中:

      $filter('filter')(myArray, {'id':73}) 
      

      或在您的 HTML 中

      {{ myArray | filter : {'id':73} }}
      

      【讨论】:

      • 谢谢 +1 我想只在带有标记的视图模式下应用过滤器,感谢您在控制器中使用它的想法。
      • 请注意,我们需要在控制器中传递$filter才能使用此方法。
      • 值得注意的是,上面的代码将根据 ID 作为子字符串进行过滤。因此,对 73 的 id 进行过滤也会找到 733、4573、173 等。要进行严格比较,您必须根据文档传递第三个比较器参数“true”。
      • 有没有办法将结果存储在 HTML 中?我需要该过滤器结果在某个循环中。所以这将减少我在每次循环迭代中的过滤过程。顺便说一句,我是角度的新手。谢谢。
      猜你喜欢
      • 1970-01-01
      • 2016-07-26
      • 1970-01-01
      • 2022-10-14
      • 1970-01-01
      • 1970-01-01
      • 2022-08-24
      • 2011-07-31
      • 2022-11-10
      相关资源
      最近更新 更多