呼吁在一个编译多个JSON文件

Question

现在，这可能是理论上的问题，因为我还在学习AngularJS，请原谅我愚蠢。

有没有办法让Angular打电话让我们从不同的位置说出3个json文件，他们都有相同的布局，然后用一个调用“编译”或“加载”为一个，以增加加载时间？

假设我们有3个JSON文件：

1 JSON文件：

{ 
    "name": "John", 
    "sur": "Smith" 
} 

第二JSON文件：

{ 
    "name": "John", 
    "sur": "Doe" 
} 

第三JSON文件：

{ 
    "name": "Alice", 
    "sur": "Mulder" 
} 

什么将是最有效和最安全的吨方式打电话给他们，然后显示他们，使用ng-repeat？理论上，在我们决定使用表达式将它们输入到html之前，它们是否可以编译为一个“临时json文件”？

Answer 1

最终你会想要将一个数组绑定到你的视图。这ng-repeat将通过每一个项目的阵列中的每个对象迭代，并漂亮地打印成<pre/>：

<div ng-app="myApp"> 
    <div ng-controller="MyCtrl"> 
    <div ng-repeat="entry in entries"> 
     <pre ng-bind="entry | json"></pre> 
    </div> 
    </div> 
</div> 

开始3个$http.get()请求并发（很明显，你可以将这些更改为file1.json，file2.json等）。

每$http.get()承诺给我们一个response对象时，它完成。我们实际上想要response.data而不是（给我们的回应，解析为JSON），所以Array.prototype.map()你的每一个承诺response，使它成为一个承诺response.data。然后用$q.all()等待所有这些承诺完成。

一旦$q.all()承诺完成：我们有我们的JSON响应数组。将该模型添加到我们的$scope。

var myApp = angular.module('myApp',[]); 

myApp.controller('MyCtrl', function($scope, $http, $q) { 
    $q.all(
     [ 
     $http.get('https://httpbin.org/get'), 
     $http.get('https://httpbin.org/get'), 
     $http.get('https://httpbin.org/get') 
     ] 
     .map(function(promise) { 
     return promise 
     .success(function(response) { 
      return response.data; 
     }) 
     }) 
    ) 
    .then(function(multipleJson) { 
     $scope.entries = multipleJson; 
    }) 
}); 

Plunkr here。