javascript - 如何从 Angular 服务中的 API 获取数据并将其存储以供将来任何人使用

标签 javascript angularjs angular-services

这更多的是编写干净的代码/优化现有代码。 我正在编写我的 Angular 服务来从后端获取数据,如下所示

angular.module('myApp').service('Auth', ['$http', '$q', 'Config', function($http, $q, Config) {
    this.getUser = function() {
        return $http.get(Config.apiurl + '/auth/user')
            .then(function(response) {
                return response.data;
            }, function(error) {
                return $q.reject(error.data);
            });
    };
}]);

现在,我从数据库调用 getUser 函数 n 次。 现在的问题是,是否可以调用此服务来获取 n 次冗余数据,或者我应该将其保存在某个地方(例如根范围)以供稍后访问?或者存储在根范围中将是不好的做法,我应该考虑其他选择还是什么都不考虑? 想在这里获得一些关于 Angular 社区的看法。

最佳答案

这是一个示例 example了解如何使用工厂在应用程序中共享数据。

让我们创建一个工厂,可在所有 Controller 的整个应用程序中使用它来存储数据并访问它们。

工厂的优点是您可以在其中创建对象并在 Controller 中的任何位置初始化它们,或者我们可以通过在工厂本身中初始化它们来设置默认值。

工厂

app.factory('SharedData',['$http','$rootScope',function($http,$rootScope){

    var SharedData = {}; // create factory object...
    SharedData.appName ='My App';
    return SharedData;
}]);

服务

app.service('Auth', ['$http', '$q', 'SharedData', function($http, $q,SharedData) {
   this.getUser = function() {

            return $http.get('user.json')
              .then(function(response) {
                  this.user = response.data;
                  SharedData.userData = this.user; // inject in the service and create a object in factory ob ject to store user data..
                  return response.data;
              }, function(error) {
                  return $q.reject(error.data);
              });

    };

}]);

Controller

var app = angular.module("app", []);
app.controller("testController", ["$scope",'SharedData','Auth',
  function($scope,SharedData,Auth) {

    $scope.user ={};
   // do a service call via service and check the shared data which is factory object ...
   var user = Auth.getUser().then(function(res){
       console.log(SharedData);
       $scope.user = SharedData.userData;// assigning to scope.
   });


  }]);

在 HTML 中

<body ng-app='app'>
    <div class="media-list" ng-controller="testController">

       <pre> {{user | json}}</pre>

    </div>

</body>

关于javascript - 如何从 Angular 服务中的 API 获取数据并将其存储以供将来任何人使用,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/40203101/

相关文章:

javascript - Angular v5 英雄教程中 hero.service.ts 的 deleteHero 方法中的管道编号( | 编号)是什么

javascript - 在 Angular.js 中绑定(bind)服务变量

javascript - 在 angular2 中制作我自己的记录器

javascript - 当我将 window.onload 设置为两个不同的函数时,它仅运行一个函数

javascript - 不明白为什么 Backbone collection.create 不 POST 一个数组

javascript - MongoDB原生 Node 驱动: Explain is Broken?

javascript - 为什么添加到 JavaScript 数组中的对象在添加后立即读回时显示为未定义?

php - AngularJS http Post 请求与 IIS 8.5 中的 405 方法不允许错误

angularjs - 访问 Angular-UI-Router 的 onExit 范围?

angularjs - 使用 AngularJS 等单页框架时如何使用 NodeJS 解决社交分享和搜索引擎问题