AngularJS：如何在我的 SPA 的所有页面和控制器之间共享数据？

Question

在我的单页应用程序的所有控制器和范围之间共享一些数据的最佳方式是什么？

假设我有一小部分数据希望能够随处访问，并且我不想每次需要时都查询数据库。

Answer 1

要存储在$rootscope变量中的数据

(或)

要存储在服务中的数据

Answer 2

共享数据服务似乎是最适合您的情况。有 $rootScope 作为全局范围，但是，由于性能问题，$rootScope 不应该用于此类事情。 $rootscope 是 angular 摘要循环的一部分，因此当您向其中添加内容时，您也会添加更多需要检查的内容。因此，除非非常必要，否则不建议使用。

例如，对于简单的服务：

app.service('SharedDataService', function () {
     var Data = {
        field1: 'qweqwe',
        field2: '12312'
    };

    return Data;
});

对于具有异步操作的复杂服务：

app.service('SharedDataService', function () {
    var self = this; 
    this.getData = function () {
        if(self.cachedData){
            return $q.resolve(self.cachedData);
        }

        return $http.get('my-data-url').then(function (response) {
            self.cachedData = response.data;
            return self.cachedData;
        });
    };
});

控制器：

app.controller('MyController', function ($scope, SharedDataService) {
    SharedDataService.getData().then(function (data) {
        $scope.data = data;
    });
});

Answer 3

在 angularJS 中，您可以通过不同的方式执行此操作。你可以使用 $rootscope 或者你可以广播数据或者你可以使用服务或工厂。

但最好的方式是使用服务。首先是它很容易。您可以在每个控制器上使用相同的服务来访问数据。

如果您想了解更多关于 angularjs 服务的信息，请查看下方 link。

http://viralpatel.net/blogs/angularjs-service-factory-tutorial/

Answer 4

最好使用服务说 commonService 并在从数据库中获取数据后存储在服务内部的变量上，如下所示

this.dbDataSearch = function(parameters){
  // Search record from database
  this.resultData = data;
}

在控制器 1 中：

$scope.data = commonService.resultData;

在控制器 2 中：

$scope.data = commonService.resultData;

在控制器 n 中：

$scope.data = commonService.resultData;

AngularJS：如何在我的 SPA 的所有页面和控制器之间共享数据？

AngularJS: How do I share data accross all pages and controller of my SPA?

controllers

data-sharing

angularjs

angularjs-scope