在AngularJS控制器之间共享数据,但共享数据来自Ajax调用

Question

我已经想出如何在下面的设计示例中使用共享服务在两个AngularJS控制器之间共享数据:

(功能小提琴)

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

app.factory('UserData', function() {
    var data = {foo: 'bar'};

    return {
        getData: function() {
            console.log('getData');
            return data;
        },
        setData: function(newData) {
            data = newData;
        }
    };
});

function MainCtrl($scope, UserData) {
    console.log('MainCtrl');
    console.log(UserData.getData());
}
MainCtrl.$inject = ['$scope', 'UserData'];

function JobListCtrl($scope, UserData) {
    console.log('JobListCtrl');
    console.log(UserData.getData());
}
JobListCtrl.$inject = ['$scope', 'UserData'];

我的问题是我希望保留的数据UserData来自Ajax调用(可能是使用$http).

我尝试在UserData工厂函数中执行Ajax调用,但是,因为它是异步运行的,MainCtrl并且JobListCtrl在UserData服务实际上有任何数据之前执行.

有人可以给我一些关于如何设置它的方向吗？

Answer 1

我创建了这个示例,演示了如何在不丢失其可绑定功能的情况下跨不同控制器获取,存储和共享数据(模型).

实例: http ://pablodenadai.github.io/SharingModelsAngularJS/

源代码1 :(资源和模型抽象)https://github.com/pablodenadai/SharingModelsAngularJS/blob/master/app/scripts/controllers/main.js

回复: https ://github.com/pablodenadai/SharingModelsAngularJS

希望能帮助到你.