通过核心 Javascript 检测 AngularJS 路由

Question

在 Angular JS 应用程序中，我们可以使用 'ngRoute' 或 'ui-router' 进行路由。我创建了一个 javascript 函数来检测 AngularJS 应用程序中的路由更改。我曾经在下面为此编写代码。

window.onhashchange = function() { //code here }

但是，它只检测基于 '#'（哈希）的 url，例如：myurl.com/#home

如果在 AngularJS 中启用了“html5Mode”。上面的代码不起作用。请帮助我通过 Javascript 检测干净的 url。

Answer 1

向 Angular 注入监听器

angular.element(
   document.querySelector('.ng-scope')
).scope().$root.$on('$locationChangeStart', function(route, next, current){ 
   console.log(next, current);
});

找到第一个角度节点

• document.querySelector('.ng-scope')

将其包装成 jqLit​​e 或 jQuery（如果存在）

• angular.element()

获取dom的作用域，

• .scope() //这可能已经是 $rootScope

从作用域中获取 $rootScope 以确保

• $root

监听事件

• .$on

这是 ngRoute 开始监听的地方

• $locationChangeStart

使用路由对象和下一个 url 和当前 url 回调。

• 函数（路由，下一个，当前）{}