簡體   English   中英

在 AngularJS 中從另一個服務中調用一個服務

[英]Calling a service from within another service in AngularJS

我試圖從另一個服務中調用一個服務,然后使用返回的對象來執行一些操作。 我一直遇到TypeError: getDefinitions is not a function錯誤,但是。

下面是我的服務被調用、調用的服務以及我的相關控制器代碼:

定義.service.js:

'use strict';

angular.module('gameApp')
  .factory('definitionsService', ['$resource',
    function($resource) {
      var base = '/api/definitions';
      return $resource(base, {}, {
        get: {method: 'GET', url: base}
      });
    }]);

實用程序.service.js:

'use strict';

angular.module('gameApp')
  .factory('utilitiesService', ['definitionsService',   function(definitionsService) {

    return {
      description: description,
      detail: detail,
      severity: severity,
    };

    function description(account) {
      var key = angular.isDefined(getDefinitions().ABC[account.code]) ? account.code : '-';
      return getDefinitions().IDV[key].description;
    }

    function detail(account) {
      var key = angular.isDefined(getDefinitions().ABC[account.code]) ? account.code : '-';
      return getDefinitions().IDV[key].detail;
    }

    function severity(account) {
      var key = angular.isDefined(getDefinitions().ABC[account.code]) ? account.code : '-';
      return getDefinitions().IDV[key].severity;
    }

    var getDefinitions = function() {
      definitionsService.get().$promise.then(function(data) {
        return data;
      });
    };
  }]);

控制器.js:

'use strict';

angular.module('gameApp')
  .controller('AccountsController', AccountsController);

AccountsController.$inject = ['$routeParams', 'customersService', 'utilitiesService'];

function AccountsController($routeParams, playersService, utilitiesService) {
  var vm = this;
  var playerId = $routeParams.playerId;

  var getAccounts = function() {
    playersService.getAccounts({
      playerId: playerId
    }).$promise.then(function(accounts) {
      for (var i = 0; i < accounts.length; i++) {
        if (angular.isDefined(accounts[i].secCode)) {
          accounts[i].code = accounts[i].secCode;
          accounts[i].severity = utilitiesService.severity(accounts[i]);
          accounts[i].detail = utilitiesService.detail(accounts[i]);
          accounts[i].description = utilitiesService.description(accounts[i]);
        }
      }
      vm.accounts = accounts;
    });
  };

  var init = function() {
    getAccounts();
  };

  init();
}

目前,您的服務在您的變量被定義之前返回。 這意味着永遠無法達到定義。 所以它在函數執行時被聲明,但undefined 只需將您的變量定義移動到頂部。 這只會防止定義錯誤。 另一個問題是您的getDefinitions函數不返回任何內容,但您正在調用它的屬性。 我能想到的一種解決方案是使用回調,它會在您的數據加載時執行:

angular.module('gameApp')
  .factory('utilitiesService', ['definitionsService',   function(definitionsService) {
    var data;
    reload();
    var utils = {
      description: description,
      detail: detail,
      severity: severity,
      reload: reload,
      loaded: null
    };
    return utils;        

    function reload() {
       definitionsService.get().$promise.then(function(data) {
         data = data;
         if (utils.loaded && typeof utils.loaded === "function") {
           utils.loaded();
         }
       });
    }    

    function description(account) {
      var key = angular.isDefined(data.ABC[account.code]) ? account.code : '-';
      return data.IDV[key].description;
    }
}]);

然后在您的控制器中,您可以使用這樣的服務:

utilitiesService.loaded(function(){
    accounts[i].description = utilitiesService.description(accounts[i]);
})

老問題,但仍然相關。 要擴展上面 Florian Gl 的回答,如果您有一個具有多種功能的服務,並且其中一個或多個功能需要調用“服務前”功能,例如加載一些資源數據,例如配置信息,請將該服務調用移動到頂部,嵌套函數之外(在下面的這種情況下,我正在處理 JavaScript 中的 promise 場景):

    angular.module('gameApp')
      .factory('utilitiesService', ['definitionsService',   function(definitionsService) {

        var myFirstConfigValue = '';

        // call any all services here, set the variables first
        configurationService.GetConfigValue('FirstConfg')
           .then(function (response) {
                // set the local scope variable here
                myFirstConfigValue = response;
           },
           function() { });

        function myTestFunction() {
            // make an ajax call or something
            // use the locally set variable here
            ajaxService.functionOneTwo(myFirstConfigValue)
               .then(response) {
                    // handle the response
               },
               function(err) {
                  // do something with the error
                });

        }
    }]);

這里要注意的關鍵點是,如果您需要加載某些數據,您首先要在服務內的任何其他函數之外執行此操作(例如,您想要加載一些 JSON 數據)。

暫無
暫無

聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.

 
粵ICP備18138465號  © 2020-2024 STACKOOM.COM