我爱编程

Angular 1.6版本以上路由中/#!/的解决方法

2017-04-24  本文已影响0人  大声喊阿森纳

AngularJS 路由 是通过“# +” 标记 帮助我们区分不同的逻辑页面并将不同的页面绑定到对应的控制器上。因此在设置好路由规则后,为html页面的a标签设置href路由链接切换不同的视图。Angular1.6版本之前通常有href=“#...”或href=“#/...”这两种写法,结果这两种写法在Angular1.6中没有任何反应。

惊现:浏览器地址栏,默认视图链接竟然显示“#!/..”,是的,中间多加了个!号。


AngularJS升级到了1.6版本后,修改了hash前缀/#!/。那么1.6究竟做了哪些改变呢?可以参考这个:https://github.com/angular/angular.js/commit/aa077e81129c740041438688dff2e8d20c3d7b52

解决方案一:
在html页面a标签上将href的属性值添加一个!号就可以了。 -最简单的方式!!

<p><a href="#!/addStudent">添加学生</a></p>  
<p><a href="#!/viewStudents">查看学生</a></p>  

解决方案二:
让路由依旧表现的与之前版本的一致:

appModule.config(["$locationProvider","$routeProvider",function($locationProvider,$routeProvider){  
        /*  将hash前缀修改为旧版本的空值 */
        $locationProvider.hashPrefix('');  
}]); 
上一篇下一篇

猜你喜欢

热点阅读