angular发送事件到指令

时间:2015-01-04 17:48:15

标签: javascript angularjs

我想从我的视图控制器向指令发送一个事件(我想编写一个通用警报框,可以通过外部视图控制器的事件接收警报)。我做了以下事情:

在我的视图模板中,我添加了指令:

html模板视图:

<alert-box></alert-box>

在视图控制器中:

$scope.$broadcast('add-alert', {type: 'danger', msg: message});

我的指示:

.directive(
'alert-box', [function () {
    return {
      restrict: 'E',
      templateUrl: '/directives/alert-box.html',
      scope: false,
      controller: [
        "$scope",
        function ($scope) {

          $scope.alerts = [];

          $scope.$on('add-alert', function(event, arg) {
            $scope.addAlert(arg);
          });

          $scope.addAlert = function (alert) {
            $scope.alerts = [];
            $scope.alerts.push(alert);
          };

          $scope.closeAlert = function (index) {
            $scope.alerts.splice(index, 1);
          };
        }]
    }
  }
]);

根据文档,您应该声明scope: false,以便从外部控制器范围继承范围。因为我使用$ broadcast,它应该将事件传播到hirachy我会除了这个工作,但它没有。我唯一的想法是,指令内的控制器总是创建一个隔离的范围。(?)

1 个答案:

答案 0 :(得分:1)

您的示例显示命名不匹配,指令名称应为alertBox而不是alert-box以使标记为