Question

我有一个指示：在模板中：

<territorial-selector></territorial-selector>

在js：

app.directive('territorialSelector', function() {
    return {
        restrict: 'E'
        ,templateUrl: 'partials/territorial-selector.html'
        ,controller: 'TerritorialSelectorController'
    };
};

正如您所见，该指令使用＆＃34; TerritorialSelectorController＆＃34;

在另一个地方，我有一个按钮，应该从TerritorialSelectorController执行方法loadTerritories（）。我创建了这个按钮：

<button ng-controller="TerritorialSelectorController" ng-click="loadTerritories()">BUTTON</button>

在这种情况下TerritorialSelectorController创建两次的问题。这是TerritorialSelectorController的代码：

app.controller('TerritorialSelectorController', ['$scope', function($scope) {
    alert('AAAAA'); // I have alert two times
}]);

我只需要控制器的一个对象。

Answer 1

如果您希望该功能作为单例工作，那么您将需要它在您的控制器随后访问的服务中。控制器不是单身人士;您可以在代码中拥有许多相同基本控制器的实例。

如果您改为创建服务，则可以通过该服务放置和访问每个控制器必须共享的公共数据/功能。

Here's a Plunk demo显示两个控制器通过服务共享数据。它不是两个相同类型的控制器，但它将向您展示服务如何工作的基础。

以下是演示中的一些代码。控制器：

app.controller('SunListCtrl', function($scope, List, $log) {
  $scope.items = List.getList();

  $scope.$on('updatedList', function() {
    $scope.items = List.getList();
    $log.info('List has been updated. Size = ' + $scope.items.length);
    $log.info('\tNow set to: ' + $scope.items);
  });
});

服务：

app.service('List', function($rootScope, $log) {
  service = {}; // the service object we'll return

  var dateValue = 'date';
  var geoValue = 'geo';
  var theList = [];

  service.setGeo = function(data) {
    geoValue = data;
    updateList();
  }

  service.setDate = function(data) {
    dateValue = data;
    updateList();
  }

  function updateList() {
    theList = [dateValue, geoValue];
    $rootScope.$broadcast('updatedList');  // broadcasts the update to listeners 
  }

  service.getList = function() {
    return theList;
  }

  return service;
});

AngularJs中的单例控制器

1 个答案: