如何在两个控制器中使用单个JSON对象而不在angularjs中单独调用？

我有两页。一个是列表及其详细页面。这两个页面的数据都来自一个json。两个页面都有两个控制器。我希望通过一次调用在两个控制器中使用相同的json。json结构如下所示：

[
  {
    "tid": "3388",
    "name": "Adagio Bar",
    "description": "Choose to enjoy one of our Italian inspired cocktails while taking in the spectacular views or simply relax.
    "field_location_category": "Aft",
    "category_tid": "351",
    "category_name": "Entertainment/Bars",
    "deck": "Sun Deck 16"
  },
  {
    "tid": "3439",
    "name": "Botticelli Dining Room",
    "description": "A sumptuous variety of dining options awaits you on every voyage.
    "field_location_category": "Aft",
    "category_tid": "350",
    "category_name": "Food and Dining",
    "deck": "Fiesta Deck 6"
  }
 ]

当我们按下列表页面时，url如下“list/tid”
如何指出对应清单的细节

控制器

“严格使用”；
var app=angular.module（'Location'，[]）；
app.controller（“位置”，函数（$scope，$http）{

$scope.locationList=null；
$http.get（“sites/all/modules/custom/locations/location.json”）
.成功（功能（数据）{
$scope.locationList=数据；
var indexedloc=[]；
$scope.locationListToFilter=函数（）{
indexedloc=[]；
返回$scope.locationList；
}
$scope.filterLocation=函数（Loc）{
var locationIsNew=indexedloc.indexOf（Loc.category\u name）=-1；
如果（位置是新的）{
indexedloc.push（位置类别名称）；
}
返回位置是新的；
}   
$scope.returnFilterLoc=function（）{return indexedloc}；
})
.错误（函数（数据）{
$（“div.content”）.html（“错误”）；
});
});

app.controller（“LocationDetail”，函数（$scope，$http）{
$scope.locationDetail=null；
$http.get（“sites/all/modules/custom/locations/location.json”）
.成功（功能（数据）{
$scope.locationDetail=数据；
})

.错误（函数（数据）{
$（“div.content”）.html（“错误”）；
});
});

我在下面的链接中添加了列表页面及其详细信息页面的html

请帮忙。

---

提前感谢。

正如@jao所建议的，您可以创建一个返回承诺的工厂：

'use strict';

angular.factory('LocationService', ['$q', '$http', function($q, $http) {
  var LocationService = {};

  LocationService.get = function(){
    var deferred = $q.defer();
    $http.get("sites/all/modules/custom/locations/location.json")
      .success(function(data) {
        deferred.resolve(data);
      })
      .error(function() {
        deferred.reject('An error occured while processing the request.');
      });
    return deferred.promise;
  };

  return LocationService;
}]);

因此，在控制器中，必须注入LocationService并调用其方法get（）：

---

@jao在评论中已经提到了正确答案。然而，可能值得再添加一个示例。基本思想是使用一个单例对象来存储数据。可以使用工厂完成。两个控制器都可以引用此对象，并且只能填充一次。代码如下：

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

// define a singleton object to be used in conrollers
myApp.factory('LocationsData', function() {
    return {
        locations: [],
        current:undefined
    };
});        

function LocationsCtrl($timeout, $scope, LocationsData) {
    $scope.data = LocationsData;
    // perform asynch call, e.g using $http
    $timeout(function() {
        $scope.data.locations = ['First', 'Second'];
        $scope.data.current = $scope.data.locations[0];
    }, 1000);
}

function LocationDetailsCtrl($scope, LocationsData) {
    // just add to scope and wait to be populated
    $scope.data = LocationsData;
}

视图：

位置列表


{{location}

位置详细信息

{{data.current}

---

您可以添加工厂并将数据存储在工厂中。看，实际上，这个问题在这里之前已经被问过多次了，所以通过一些搜索，你可以找到一些很好的例子，你仍然需要两次兑现承诺（每个控制员一次）。有没有一种方法可以像单身汉一样（你只得到一次）？非常感谢jao、martynas和udalmik对你的帮助和支持。对不起，我忘了说一件事，我的两个控制器来自两个不同的页面。我在早些时候又问了一个问题。如何指出对应清单的细节？再次感谢您的帮助。下面所示的方法可以很好地用于单独的视图，因为使用单个JS对象来存储信息。

var promise = LocationService.get();
promise.then(function(data) {
    // do stuff
}, function() {
    console.log('An error occurred while processing the request.');
});

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

// define a singleton object to be used in conrollers
myApp.factory('LocationsData', function() {
    return {
        locations: [],
        current:undefined
    };
});        

function LocationsCtrl($timeout, $scope, LocationsData) {
    $scope.data = LocationsData;
    // perform asynch call, e.g using $http
    $timeout(function() {
        $scope.data.locations = ['First', 'Second'];
        $scope.data.current = $scope.data.locations[0];
    }, 1000);
}

function LocationDetailsCtrl($scope, LocationsData) {
    // just add to scope and wait to be populated
    $scope.data = LocationsData;
}

<div ng-controller="LocationsCtrl">
    <p>Locations List</p>
    <ul>
        <li ng-repeat="location in data.locations">{{location}}</li>
    </ul>
</div>

<div ng-controller="LocationDetailsCtrl">
    <p>Location Details</p>
    {{data.current}}
</div>