Question

我正在使用AngularJS 1.3。假设我在我的应用程序中创建了几个路径。但是当用户点击特定路线/网址＆amp;然后尝试移动到另一个路线/网址，我想发射一些事件。我不想在每次更改URL时触发此事件。

因此，只有当用户离开此网址http://localhost:9000/data/55677c/edit时，我才会触发XYZ控制器中的一个功能。

以下是我的情景：

我有一个看起来像这样的页面：

<div class="well">
    <button id='edit-btn' type="button" ng-click='saveContent()'>
            <div ng-include="'components/grid/comOne.html'"></div>
</div>

components/grid/comOne.html页面包含一个网格，它有自己的控制器，负责网格的数据管理。

此网格显示在两页中。一个处于可编辑模式，另一个处于非编辑模式。当用户处于可编辑模式并尝试移出页面而不保存信息时，我需要触发事件以丢弃用户对网格数据所做的ant更改。

请建议

Answer 1

如果收听控制器是父控制器，你可以$发出事件。

或者您可以拥有这样的共同服务：

angular.module('x').factory('CommonLogic', function(){

   var pageChangeListeners = [];

   return {
      listenToPageChange: listenToPageChange
   };

   function listenToPageChange(callback){
      pageChangeListeners.push(callback);
   }

   function pageChanged(){
     for(var i = 0; i < pageChangeListeners.length; i++){
       pageChangeListeners[i]();
     }
   }

});

然后当离开该网址（通过$ routeChangeStart跟踪）时，您可以致电：commonLogic.pageChanged()

在您想要采取行动的控制器中：

commonLogic.listenToPageChange(function(){..}).

显然应该对此进行改进，以避免重复注册听众......等等。

我希望我不要过于复杂。你能更详细地描述你的用例吗？

Answer 2

我想你想使用$routeChangeStart：

$rootScope.$on( "$routeChangeStart", function(event, next, current) {

});

您可以将其置于当前控制器的范围内，可能是编辑，如您的网址所示。

来自文档：

<强> $ routeChangeStart
  在路线改变之前广播。此时，路由服务开始解决路由更改发生所需的所有依赖关系。通常，这涉及获取视图模板以及解析路由属性中定义的任何依赖项。一旦解决了所有依赖关系，就会触发$ routeChangeSuccess。

通过调用事件的preventDefault方法可以防止路由更改（以及触发它的$ location更改）。有关事件对象的更多详细信息，请参阅$ rootScope.Scope。

类型：广播

目标：根范围

当用户移出AngularJS中的特定路线时触发事件

2 个答案: