我知道在stackoverflow中已多次询问此问题,但我找不到合适的答案。
我需要实现的是能够在一个控制器中启动一些异步调用,并在结果返回时更新某个其他控制器中的$ scope。
我知道我应该使用实际执行$ http内容的共享服务,但我无法管理更新其他控制器范围。
这是我的代码:
查看
<div class="screens" ng-controller="framesController">
<div class="scroller scroll-pane" frames-scroll-pane>
<div class="overview">
{{frames}}
</div>
</div>
</div>
服务
angular.module('BrightspotApp.models', []).
factory('framesModel', function($http,globals){
var api_path = 'clickard/GetClickardById/';
var sharedService = {};
sharedService.getAsync = function (id) {
sharedService.frames = {};
$http.get(globals.serverUrl + api_path + id).
success(function (data, status, headers, config) {
sharedService.frames = data;
}).error(function (data, status, headers, config) {
console.log('HTTP error');
});
};
return sharedService;
});
控制器
angular.module('BrightspotApp.controllers', []).
/**
* Top menu controller
*/
controller('menuController', function($scope,framesModel){
$scope.clicked = false;
$scope.toggle = function (item) {
$scope.clicked = !$scope.clicked;
if ($scope.clicked){
framesModel.getAsync(1);
}
};
$scope.itemClass = function(item) {
return $scope.clicked ? 'active' : undefined;
};
}).
/**
* Frames controller
*/
controller('framesController', function($scope,framesModel){
$scope.data = [];
$scope.frames = framesModel;
});
这个东西在某种意义上起作用,它实际上在异步调用返回时更新了$ scope并因此更新了DOM。
但我需要实现的是在异步完成时(可能使用$ broadcast)获取回调以通知帧控制器,然后控制返回的数据,以便我可以在更新$ scope之前对其进行操作因此DOM。
非常感谢协助。
答案 0 :(得分:1)
这样的事情:
$http.get(globals.serverUrl + api_path + id).then(function(result){
sharedService.frames = result.data;
});
如果您希望getAsync方法在调用完成后返回数据,则可以使用defer:
sharedService.getAsync = function (id) {
sharedService.frames = {};
var defer = $q.defer();
$http.get(globals.serverUrl + api_path + id).
then(function(result){
sharedService.frames = result.data;
defer.resolve(result.data);
}).error(function (data, status, headers, config) {
console.log('HTTP error');
});
return defer.promise;
};