javascript - AngularJS 服务仅在第一次使用 Controller 时运行

Question

我有以下 Controller ，它使用客户服务来返回客户。问题是它仅在 Controller 第一次运行时执行服务。看看我的服务器，我发现它只在 Controller 第一次使用时执行获取请求(加载该 View )，如果我更改 View 并说添加客户并返回到列出客户的 View ，则它不会更新，因为没有另一个获取来自服务的请求。

  .controller('searchCTRL', ['$scope', '$http', 'Customers', function($scope, $http, Customers) {
        $scope.customers = Customers;
        $scope.deleteCustomer = function(id) {
            $http.delete('/api/customer/' + id)
                .success(function(data) {
                    $scope.customers.data = data;
                })
                .error(function(data) {
                    console.log('Error: ' + data);
                });
        };
  }])

和

.factory('Customers', function($http){
    var Customers = {};
    $http.get('/api/customer')
        .success(function(data) {
            Customers.data = data;
        })
        .error(function(data){
            console.log('error: ' + data);
        });
    return Customers;
});

如果我停留在 View 上并重新加载页面，它会像应有的那样获取数据，但对该页面的任何后续访问都不再执行获取。任何帮助将不胜感激。

Answer 1

Angular .factory 是单例，因此它始终只运行一次。此外，$http 调用是异步的，因此您应该使用promise 以便将数据获取到 Controller 。请尝试以下操作:

.factory('Customers', function($http, $q){
    return function () {
        var d = $q.defer();
        $http.get('/api/customer')
            .success(function(data) {
                d.resolve(data);
            })
            .error(function(data){
                console.log('error: ' + data);
                d.reject(data);
            });
        return d.promise;
    };
});

在你的 Controller 中:

.controller('searchCTRL', ['$scope', '$http', 'Customers', function($scope, $http, Customers) {
    Customers().then(function (data) {
        $scope.customers = data;
    });
...

当 $http 返回一个 promise 时，您可以通过执行以下操作进一步简化您的 .factory:

.factory('Customers', function($http){
    return function () {
        return $http.get('/api/customer');
    };
})

有关更多详细信息，请参阅documentation for $http .