时间戳

首页 > 解决方案 > 使用不同的范围对象作为键访问 AngularJS 范围对象

javascript - 使用不同的范围对象作为键访问 AngularJS 范围对象

问题描述

我正在使用ng-repeatSay 遍历一组人员对象，该数组如下所示：

[{
  "display_name": "John Smith",
  "status": "part-time",
  "bio": "I am a person. I do people stuff.",
}, {
  "display_name": "Jane Doe",
  "status": "full-time",
  "bio": "I am yet another person.",
}, ...]

同时，我有另一个number_list看起来像这样的对象（注意大写）：

{
  "JOHN SMITH": 12,
  "JANE DOE": 34,
  ...
}

在 HTML 中，我可以像这样从每个 person 对象进行插值：

<p>
  Person Name: {{ person.display_name }}
  Person Bio: {{ person.bio }}
  ...
</p>

但我还想从第二个对象进行插值，访问键与我所在的人对象匹配的值，如下所示：

<p>
  ...
  Person Number: {{ number_list['{{ person.display_name | uppercase }}'] }}
</p>

我使用 EMCAScript 括号表示法而不是点表示法来指定键，因为number_list(eg "JOHN SMITH") 的键名中有空格，但我从插值中什么也没得到。

我已经确认，如果我输入一个名称，例如{{ number_list['JOHN SMITH'] }}，我可以插入该值——12在这个例子中。这意味着据我所知，这个问题与范围或类似的事情无关。

标签： javascripthtmlangularjs

解决方案

您还可以使用filtertopersonNumber来表示对象： 

app.controller("ctrl", function($scope){
   $scope.persons = [...];

   $scope.number_list = [...];
})     

app.filter("personNumber", function(){
    return function(array, name){
      return array[name.toUpperCase()];
    }
})

<p ng-repeat="person in persons">
  ...
  Person Number: {{person.display_name | personNumber: number_list}}
</p>

推荐阅读