AngularJS集中数据和宁静服务

Question

我需要我的AngularJS应用程序的设计帮助。

我有一个工厂，它为我提供了一个资源对象，以一个宁静的Web服务。

product.factory("productResource", function ($resource) { 
    var resource = $resource("/fooo/rest/products/:id", {}, { 
     query: { 
      method: "GET", 
      isArray: true 
     } 
    }); 
    return resource; 
}); 

我有一个服务，它提供了一种方法来查询资源工厂的所有产品。

product.service("productDao", function (productResource) { 
    this.getProductModel = function() { 
     var data = productResource.query(function() { 
     }); 
     return data; 
    } 
}); 

的控制器调用该服务，来获取数据，他们需要：

控制器1

header.controller("header.selection.product", function ($scope, productDao) { 
     $scope.products = null; 
     productDao.getProductModel().$promise.then(function (result) { 
      $scope.products = result; 
     }); 
    }); 

控制器2,3,4 ...

他们看起来几乎一样，但他们正在使用这些数据用于不同的目的。

现在我不知道一个正确的方法，实现从所有控制器访问的“数据源”。我不想对所有数据提出请求，对于每个控制器启动，它只应该进行一次。

如何自动更改所有其他控制器的数据，当产品在一个控制器中更新时，服务应该执行更新（尚未实现），更新成功时他们的“集中数据”应该更改，并且所有的控制器数据。

我读过关于使用rootScope达到这个目的，但有人说，不要仅仅创建工厂/服务。

Answer 1

如果使用带有缓存选项的$http，则只有一个控制器会发出“真实”请求，其他所有控制器都会从缓存中获取产品。

$http.get(url, { cache: true })

或者你可以emit从工厂里面的结果，并让控制器听那个。

getProducts: -> 
    url = productsApiEndPoint 

    $http.get(url, { cache: true }) 
     .then(
     (data) -> 
      $rootScope.$emit('YourFactory.getProducts', data); 
     (error) -> 
      //handle error 
    ) 

我更喜欢第一种方法。它更清楚。您可以使用mediator pattern并协调数据流。创建一个将成为您的介体的服务，在数据到达时从该服务发送到您的控制器。从控制器到该服务发出当控制器更改的数据，然后该服务将发出回控制器

在你的工厂的其余数据发射到中介服务：

product.factory("productResource", function ($resource) { 
    var resource = $resource("/fooo/rest/products/:id", {}, { 
     query: { 
      method: "GET", 
      isArray: true 
     } 
    }); 

    resource.query(...) 
    .$promise.then(function(products) { 
     $rootScope.$emit('ProductsFetched', products); 
    }); 
}); 

在您中介服务监听并发送给控制器。

product.service("productDao", function (productResource) { 
    $rootScope.$on('ProductsFetched', function(data){ 
    $rootScope.$emit('ProductsChange', data); 
    }); 

    $rootScope.$on('ProductsChangeFromControllers', function(data){ 
    $rootScope.$emit('ProductsChange', data); 
    }); 
}); 

在你的控制器倾听并发射到中介服务：

header.controller("header.selection.product", function ($scope, productDao) { 
     var products = null; 
     $rootScope.$on('ProductsChange',function(data){ 
      products = data; 
     }); 

     // do something with the products 
     $rootScope.$emit('ProductsChangeFromControllers', products); 

    }); 

也许有一些语法错误，但我只是想给你一个想法如何构建它。