如何将全局异步数据存储/通信到控制器

How to store/communicate global asynchronous data to controllers

本文关键字:通信 控制器 存储 数据 全局 异步      更新时间:2023-09-26

基本前提是。。。。

我有一份申请。当用户点击应用程序时,它会立即通过ajax调用从sharepoint服务器获取有关用户的各种信息。根据从用户那里接收到的数据类型,应用程序必须显示/隐藏某些信息并设置某些设置。

应用程序中的每个控制器都严重依赖于从该共享点服务器返回的数据。

我有几个问题。。。

首先,这个ajax调用应该在哪里进行?理想情况下,它应该尽快运行,那么它应该在app.run()中执行吗?

第二个,从sharepoint服务器返回的数据应该存储在哪里?我读到,仅仅为了存储数据而创建工厂并不是最佳实践,最好只使用$rootscope。现在,我只是在一个名为"User"的工厂中存储一个User对象,事后看来,我想这是一个无

最后,我不确定是否有办法暂停加载控制器,因为它们在很大程度上依赖于返回的数据,但如果没有,如何将接收到的信息传达给控制器。这会是使用$broadcast方法的情况吗?

现在我有一个很难解决的问题。它完成了任务,但我敢肯定它不是理想的

这是一个控制器的一部分。我正在将工厂用户注入

if (User.HasLoadedUserProps == false)
{
    User.registerObserverCallback(hasLoadedProperties);
    User.GetUser("1111");
}
else
{
    if (User.IsAdmin == true)
        //do whatever
}

一旦从ajax调用返回了必要的信息,它就会调用这个

var hasLoadedProperties = function ()
{
    if (User.IsAdmin == true)
        //do whatever
    else
        utilities.popupBox("You do not have permission to view this page", "Access Denied");
}

任何智慧、见解或建议都值得赞赏!

第一个:

ajax调用何时发生取决于一些事情,但由于您提到希望将控制器加载推迟到用户数据被删除,因此最好将调用放入服务中。在我对你上一篇文章的回应中,我将对此进行更多的阐述。将这些数据放在服务中也可以更容易地在控制器之间共享,这将使我们进入下一个阶段。。。

第二:

您的用户数据绝对应该进入服务,绝对不应该$rootScope。想象$rootScope就像在JavaScript中做window/globals一样。你想避免在任何事情上使用它。一个例外是,您确实需要使用事件($broadcast/$emit/$on(,但即使是这些情况也应该很少见。

最后:

查看$routeProviderresolve选项(如果您喜欢该路线,ui-router也有类似的选项(并非双关语(。

此选项允许您推迟控制器的实例化,直到一组promise得到解决。在您的情况下,您应该从User服务返回一个promise,一旦检索到用户数据,就会解决这个问题。

为了帮助演示这些要点,我做了一个简单的演示。这段代码,以及到Angular文档的链接,应该足以让你开始。。。

angular.module('myApp', ['ngRoute'])
.config(function($routeProvider) {
  $routeProvider.when('/', {
    templateUrl: 'beer.html',
    controller: 'BeerController',
    resolve: {
      beer: function(Beer){ //injected into controller once promise is resolved
        return Beer.getFavorite();
      }
    }
  })
})
.controller('BeerController', function($scope, beer) { // Will load after 3s
  $scope.favoriteBeer = beer; // beer comes from resolve in $routeProvider
})
.factory('Beer', function($timeout) {
  var beer = {
    favorite: 'porter'
  };
  beer.getFavorite = function() {
    return $timeout(function() { // pretend this is an ajax call
      return beer.favorite;
    }, 3000);
  }
  return beer;
});

其中beer.html包含:

<div>
  My favorite kind of beer is: {{favoriteBeer}}
</div>