只调用一次控制器函数，两个div使用相同的控制器

Question

我正在开发angularjs。我有两个div共享同一个控制器。我的控制器代码是.

var app=angular.module('categoryPageApp', []);
app.controller('NgProducts', function($scope,UpdateService) {
   $scope.orderby=5;
   $scope.pageNumber=1;
   $scope.loadProducts=function($scope){
             //here goes ajax call
     };
 });

我的两个控制器相同的潜水器是

<div ng-app="categoryPageApp">
<div id="cat-products" ng-controller="NgProducts">
</div>
<div id="brand-filter" ng-controller="NgProducts">
</div>
</div>

正如我们所看到的，现在两次所有变量都将被声明，并且还会调用update函数。我不希望这种情况发生，因为单次http呼叫将完成工作。有什么解决办法吗。

此外，我想使用angular js为我的产品构建寻呼机。如有任何帮助，我们将不胜感激。

Answer 1

您可以在加载产品后尝试存储一些标志，如下所示：

app.controller('NgProducts', function($scope,UpdateService) {
   if (!$scope.productsAreLoaded)
     $scope.orderby=5;
     $scope.pageNumber=1;
     $scope.loadProducts=function($scope){
        //here goes ajax call
        $scope.productsAreLoaded = true;
     };
});

Answer 2

这样做：

<div ng-app="categoryPageApp" ng-controller="NgProducts">
    <div id="cat-products"></div>
    <div id="brand-filter"></div>
</div>