4

我有一个角度控制器,只要用户在控制器范围之外单击,它就需要重置。我该怎么做呢?

示例 html:

<div id='parent'>
    <div id='1' ng-controller="ctrl1">
        <!--other things-->
    </div>

    <div id='2' ng-controller="ctrl2">
        <!--other things-->
    </div>
</div>
<div id="parent2">
        <!--other things-->
</div>

ctr2如果点击发生在 div2 之外,我希望能够重置 ctrl2

ctr2 内部定义了一个重置​​函数

4

2 回答 2

4

如果您希望在单击发生在同级 div 中时进行重置,那么控制器共享的事实$scope应该使这一点相当简单。如果您想在页面上其他任何地方发生点击时重置 div ,那么您应该将“重置”div 设置为指令,将$window对象绑定到点击处理程序:

app.directive('reset', function($window){
  return {
    template: '<div ng-class="{red: directiveToggler}">I\'m in 2' +
              ' - click me to turn red, click anywhere else to turn me normal'+
              '</div>',
  controller: function($scope){
    $scope.directiveToggler = true;
  },
  link: function(scope, element){

    var w = angular.element($window);
    w.bind('click', function(e){

      if (e.target != element[0].children[0]){
        scope.directiveToggler = false;
        scope.$apply();

      } else {
        scope.directiveToggler = true;
        scope.$apply()
      }
    })
  }
  }
})

请注意,处理类/样式更改的方法可能比我设置的更好,但问题是关于点击事件;)。

这是一个演示

于 2013-06-21T15:47:57.233 回答
1

您可以使用$rootScope向其他控制器广播事件。看到这个 JSFiddle:http: //jsfiddle.net/simpulton/XqDxG/

于 2013-06-21T06:05:42.077 回答