Question

对于Web应用程序，我使用AngularJS从两个JSON文件加载数据。我可以在HTML中输出两个文件数据，但我必须找到一种方法来使用第一个文件（posts.json）中的数据来解决第二个文件（users.json）。

posts.json的示例：

{
  "title": "Some topic",
  "thread_id": 111,
  "messages": [
    {
      "user_id": 123,
      "message": "Hello, I'm Jim"
    },
    {
      "user_id": 987,
      "message": "Hi Jim, I'm Bob"
    },
  ]
}

users.json的示例：

[
  {
    "123": {
      "name": "Jim",
      "location": "London",
      "website": "http://j.im"
    }
  },
  {
    "987": {
      "name": "Bob",
      "location": "New York",
      "website": "http://b.ob"
    }
  }
]

一个简单的HTML示例可能如下所示：

<p ng-repeat="talk in talks.messages">{{talk.name}} says {{talk.message}}</p>

但是，我还想在ng-repeat块中添加一些用户的元数据，例如将用户名链接到他的网站。

或者把它放在一个不正确的表达中，如下所示：

<a href="{{{{talk.user_id}}.website}}">{{talk.name}}</a>

Answer 1

您可以在控制器或指令中生成映射对象。类似的东西：

.directive('myDirective', function($scope, _) {
  $scope.posts = /* load your posts */
  $scope.users = /* load your users */
  $scope.usersById = _.indexBy($scope.users, 'id')
})

然后你会在你的模板中使用它，如：

<p ng-repeat="talk in talks.messages">
  {{talk.title}} by {{usersById[talk.user_id].name}}
</p>

AngularJS：混合来自两个JSON文件的数据

1 个答案: