Question

我有一个部分来自多个控制器的数据，而不是那些在控制器中调用的函数，它们在服务器上击打超过五十次，并且只要它们没有得到它们就会一直打来自服务器的响应。我不知道如何处理这种情况请指导我。

mainControllers.controller('AddProductController', ['$scope', '$http', '$routeParams', '$cookies', '$rootScope', 'Upload', '$timeout', '$uibModal', '$log', '$document', '$window', 'variantsService', 'toaster', '$route', '$rootScope', 'Lightbox', function ($scope, $http, $routeParams, $cookies, $rootScope, Upload, $timeout, $uibModal, $log, $document, $window, variantsService, toaster, $route, $rootScope, Lightbox) {


    /*Currency dynamic*/
    $scope.currency = function () {
        $http.get('currencies',
                {headers:
                            {'Content-Type': 'application/x-www-form-urlencoded',
                                'Authorization': $rootScope.keyword_auth_token, 'Accept-Language': $cookies.get('type')}
                })
                .success(function (data) {
                    $scope.user_curr = data[0].code;
                })
                .error(function (data) {
                    console.log(data);
                });
    };

    /*Currency dynamic ends here*/
    $scope.currency();

}]);

有什么办法，所以我可以限制这件事吗？

Answer 1

我总是把电话放在一个服务中，然后你可以完全控制。像这样：

app.service("currencyService", function($q, $http) {
    var _currencyPromise = null,
        _currencies = null;

    this.getCurrencies = function() {
        var deferred = $q.defer();

        // Check if the currencies are resolved before
        // If so, immediately return these
        if (_currencies) {
            deferred.resolve(_currencies);
        } 
        // Else check if the promise is already running
        // If so, use that promise
        else if (_currencyPromise) {
            _currencyPromise.then(function(response) {
                deferred.resolve(response.data);
            });
        }
        // Else make the http call and assign to the promise
        // So that the promise can be used instead of a new http call
        else {
            _currencyPromise = $http.get("..");
            _currencyPromise.then(function(response) {
                // Assign data to the currencies, so that it can be used
                // by next calls immediately
                _currencies = response.data;
                deferred.resolve(_currencies);
            }, function(error) {
                // something went wrong
                _currencyPromise = null;
                deferred.reject();
            });
        }

        return deferred.promise;
    }
});

然后在您的控制器中，您始终可以使用此服务，而http调用只会进行一次：

app.controller("myCtrl", ["$scope", "currencyService", function($scope, currencyService) {
    currencyService.getCurrencies().then(function(currencies) {
        $scope.user_curr = currencies[0].code;
    });
}]);

请参阅this jsfiddle以供参考。在控制台中，您可以看到API仅被调用一次。

Answer 2

对于单个部分拥有多个控制器绝对是个坏主意。在这种情况下，您应该考虑使用角度工厂来维护数据。但是为了给你提供一个简短的解决方案，你应该删除$ scope.currency（）;来自你的控制器（因为它会在你的控制器初始化后立即调用api）并考虑使用ng-init内置指令。因此，基本上在您使用ng-controller =＆＃34; AddProductController＆＃34;的部分中，您可以添加ng-init =＆＃34; currency（）＆＃34; （如果你想打电话给api）。

Answer 3

我提出了一个非常简单的解决方案。例如，我有view这样的

<div ng-controller="HomeController">                    
<div class="active tab-pane" ng-controller="AddProductController" ng-init="subcategories_id();currency();">

<p>{{user_curr}}</p>

</div><!--ends here->
<p>first controller {{abc}}</p>
</div>

我使用的nginit工作正常。

如何限制控制器角度Js中的函数调用次数？

3 个答案: