javascript - 当 onInit 钩子(Hook)被多次调用时，如何在 Angular 1.5 中仅调用一次特定的 Promise

Question

我正在 onInit 函数上进行 API 调用。

   vm.$onInit = function() {
        var callInProgress = false;
        var resultsLoaded = false;

        var url = '/api/times/cst';
        if(callInProgress === false && resultsLoaded ===false){
            callInProgress = true;
            HttpWrapper.send(url,{"operation":'GET'}).then(function(result){
                vm.times = result;
                resultsLoaded = true;
                },function(error){
                vm.errorInApi = true;
            });
        }

现在 $onInit 被多次调用，因此两个标志 callInProgress, resultsLoaded 每次都会被初始化。

所以，检查有点不起作用。

每次调用 $onInit 时都会调用 API，初始化时会调用多次。

如何才能只调用一次电话？不过它已在 $onInit 上调用。

Answer 1

我建议将 API 调用包装在如下服务中:

(function (angular) {
    'use strict';

    angular
        .module('services.common')
        .service('TimesService', TimesService);

    TimesService.$inject = ['HttpWrapper'];

    function TimesService(HttpWrapper) {
        var timesService = this;
        var timesResult = null;

        timesService.getTimes = getTimes;

        function getTimes() {
            if (!timesResult) {
                timesResult = HttpWrapper.send('/api/times/cst', {"operation": 'GET'});
            }
            return timesResult;
        }

        return timesService;
    }

})(angular);

然后将其注入(inject)到您的 Controller 中并像 TimesService.getTimes().then(...) 一样使用，因此对 API 的调用将在第一次调用 TimesService.getTimes (因为结果将存储在服务内部的 timesResult 中)。