在 ui 路由器状态之间发送事件

Sending events between ui-router states

本文关键字：事件 之间 状态 ui 路由器      更新时间：2023-09-26

我有一个 AngularJS 应用程序，其中视图将$broadcast一个"上下文更改"事件，以告诉其子视图(ng-include带有控制器和指令，所有带有其子范围(父视图中发生了什么。现在我使用 ui-router 重构它，以便有一个父状态(非抽象(和子状态。

父级仍然很高兴地$broadcast其"上下文更改"事件，但子状态永远不会得到它们。这并不完全让我感到惊讶，因为 ui-router 不会继承作用域，但这对我来说仍然是一个问题。国家之间这种沟通的良好模式是什么？我们能否利用这样一个事实，即我试图连接的状态之间存在现有的父子关系？我可以使用服务，然后服务如何$broadcast事件(因为$broadcast是一个作用域方法，而该服务没有特定的作用域(。

我试过打电话给$rootScope.$broadcast(而不是$scope.$broadcast(无济于事。我只是不确定$rootScope是否是一个共享范围，或者我实际上期望它只是一个通用定义(如类继承(。

我开始更好地理解打电话给$rootScope.$broadcast的后果.它将通知世界。我对event.targetScope进行了一些检查(可能是为了确保控制器不会通知自己(。现在我删除了检查，我收到了消息，但不幸的是，它们太多了(来自层次结构中完全不同的位置的控制器(。我只希望父母通知其孩子。当我使用ng-include时，这意味着父范围与子范围。现在我正在使用ui路由器，我希望它与父状态(控制器(和子状态(控制器(一起使用，但我不知道该怎么做。

对于它的价值，我想分享这个问题的解决方案。我怀疑这个解决方案的价值，因为我仍然被一些问号所困扰。我在良好的根本原因分析方面失败了，因为我对$scope.$broadcast和ui-router的内部工作原理没有足够的了解，并且对$rootScope是如何继承的缺乏了解。

这里有两个独立的概念在起作用：

  • 作用域的父/子关系
  • 父/子状态

根据 ui 路由器文档：

不继承任何其他 [除了解析的依赖项和自定义数据属性] (没有控制器、模板、URL 等(。

因此，期望(请参阅原始问题下方的评论($broadcast只有在从$rootScope完成时才有效。但是，这不能与我现在的工作实施合作。

无论如何，我的问题似乎是由于过早地触发事件(从父状态到子状态的控制器(引起的，$stateChangeSuccess.当我开火时$viewContentLoaded孩子会收到它。请注意$scope.$broadcast;不$rootScope.

$scope.$on('$viewContentLoaded', function(event, toState, toParams, fromState, fromParams) {
    $scope.$broadcast("contextChanged", $scope._fullContext);
})

然后我剩下要做的就是处理一些无意的事件，从层次结构中的错误位置或在错误的时间触发，所有这些都可能是因为这不是最适合的设计。我用一些模糊的逻辑修复了它。

给下一个女孩或男人的一个提示：一定要测试这两种情况：

  • 用户浏览到/parent-state，然后将状态更改为/parent-state/child-state
  • 用户立即浏览以/parent-state/child-state

我经常因为这个:)过早地欢呼

相关文章：