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

我已经想出如何在下面的设计示例中使用共享服务在两个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）。

我尝试在中进行Ajax调用 UserData 工厂功能但是，因为它是异步运行的， MainCtrl 和 JobListCtrl 在执行之前执行 UserData 服务实际上有任何数据。

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

13200

2018-02-26 19:49

起源

看到 stackoverflow.com/questions/12505760/... 如何使用promise，然后让你的控制器等待它被解决。 - Mark Rajcok

@MarkRajcok，这就是诀窍。谢谢！ - Mark Biek

答案:

我创建了这个示例，展示了如何实现 获取，存储和共享 跨越不同控制器的数据（模型），而不会失去其可绑定功能。

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

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

回购： https://github.com/pablodenadai/SharingModelsAngularJS

希望能帮助到你。

2018-05-25 01:49

对于那些不太热衷于Angular依赖关系的人来说，在这里或在Git中提供一点见解可能是有用的。 - Augie Gardner

这对于一个集合是如何工作的，比方说，我想从“模态”控制器添加一个模型，并在保存数据时更新主列表？假设模态控制器是抽象的（可以是在主控制器范围内的任何模态“浮动”）。 - FlavorScape

现场示例暂不起作用。这里没有GitHub页面。 - Sergey P. aka azure

以下是一些帮助您解决问题的起点：

如何从服务器获取数据（以及如何构建基本的“模型”服务）：所以发帖
如何在从服务器获取数据之前保持控制器执行：来自egghead.io的截屏视频

2018-02-26 20:06

如果服务是单例（到处都是相同的数据），我如何定义ModelType并创建可以从多个控制器访问的那种类型的实例？ stackoverflow.com/questions/24291136/... - FlavorScape

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

答案:

热门问题

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