angular路由

本文介绍了Angular中的路由模块ngRoute的基本配置及使用方法,并讨论了其在页面跳转方面的限制。此外,还介绍了如何通过引入第三方模块ui-router来实现多级嵌套路由。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

  闲来无事,写一写我们常用的angular中的路由,angular中路由是既简单有好用一种页面切换方式,对于angular而言他有自己的路由模块--ngRoute,

  首先需要我们引入,angular.js与angular.route.js,然后配置HTML中的代码,(省略)

  下面是js文件中需要写入的代码

  以下代码可以直接拿来使用 只需要修改一些参数

<script type="text/javascript">

var app = angular.module("myApp",["ngRoute"]);

app.controller("ctr",function(){

 

});

//angular 1.6.0以上版本需要配置  

//此处需要注意,如果不写此行代码 会显示错误

app.config(["$locationProvider",function($locationProvider){

$locationProvider.hashPrefix("");

}]);

//配置路由信息

app.config(function($routeProvider){

$routeProvider.when("/aaa",{templateUrl:"a.html"});

$routeProvider.when("/bbb",{templateUrl:"b.html"});

$routeProvider.when("/ccc",{templateUrl:"c.html"});

$routeProvider.otherwise({templateUrl:"a.html"});

});

</script>

 

以上便可以实现简单的路由功能,那么问题来了,此种路由不能进行嵌套,什么意思呢?意思为:在我们的项目中,已经使用了ngRoute路由功能实现页面的跳转切换,那么如果在切换后的页面中嵌套路由功能,ngRoute是无法实现的,此时需要我们引入第三方路由模块,叫做ui.router模块.

UI,router有两个好处,

多视图 嵌套视图

有了ui.router就可以实现多层嵌套路由了

转载于:https://www.cnblogs.com/sunweinan/p/ngRoute.html

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值