<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<title></title>
<meta charset="utf-8" />
<script src="../Scripts/angular.min.js"></script>
<script src="../Scripts/angular-route.min.js"></script>
</head>
<body>
<div ng-app="myApp">
<div ng-controller="firstController">
{{text}}
</div>
<script type="text/javascript">
var app = angular.module("myApp", ['ngRoute']);
app.config(['$routeProvider', function ($routeProvider) {
$routeProvider.when("/aaa/:num", {
template: '<p>首页的内容</p>{{name}}', //templateUrl
contorller:"Aaa"
}).when("/bbb", {
template: "<p>学员的内容</p>{{name}}",
contorller:"Bbb"
}).when("/ccc", {
template: "test.html",
contorller:"Ccc"
}).otherwise({
redirectTo:"/aaa"
});
}]);
</script> </div>
</body>
</html>

AngularJs练习Demo16 ngRoute的更多相关文章

  1. AngularJS 路由:ng-route 与 ui-router

    AngularJS的ng-route模块为控制器和视图提供了[Deep-Linking]URL. 通俗来讲,ng-route模块中的$routeService监测$location.url()的变化, ...

  2. angularjs之插件ngRoute和ngAnimate

    使用ngRoute和ngAnimate配合使用,可以实现页面切换的效果. 如果有使用过swiper,就知道这个效果是怎么样的. 代码: <!DOCTYPE html> <html l ...

  3. AngularJS Best Practices: ngRoute

    app/----- components/---------- users/--------------- controllers/-------------------- users.control ...

  4. AngularJs练习Demo17 ngRoute

    <!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" content ...

  5. [AngularJS] AngularJS系列(2) 中级篇之路由

    目录 原理 angular-route ui-router 事件 深度路由 原理 ng的route本质是监听hashchange事件. 在angular-route中 $rootScope.$on(' ...

  6. angularjs 路由回退,返回到上一个路由

    在现阶段比较流行的angularjs框架中:路由是一个比较重要的应用:angularjs的单页面是其强大功能之一: 所有的页面其实就只是在一个页面就实现的:angularjs通过对路由的控制来进行页面 ...

  7. AngularJS基础总结

    w3shools    angularjs教程  wiki   <AngularJS权威教程> Introduction AngularJS is a JavaScript framewo ...

  8. ngRoute 和 ui.router 的使用方法和区别

    在单页面应用中要把各个分散的视图给组织起来是通过路由机制来实现的.本文主要对 AngularJS 原生的 ngRoute 路由模块和第三方路由模块 ui.router 的用法进行简单介绍,并做一个对比 ...

  9. AngularJs轻松入门(七)多视图切换

    在AngularJs应用中,我们可以將html碎片写在一个单独的文件中,然后在其他页面中將该段碎片加载进来.如果有多个碎片文件,我们还可以在控制器中根据用户的操作动态的加载不同的碎片,从而达到切换视图 ...

随机推荐

  1. 详解CSS选择器、优先级与匹配原理

    原文链接:http://polaris1119.javaeye.com/blog/764428 作为一个Web开发者,掌握必要的前台技术也是很重要的,特别是在遇到一些实际问题的时候.这里给大家列举一个 ...

  2. php urlencode()函数URL编码转换实例解析

    URLEncode:是对网页url所包含中文字符的一种编码转化方式,URLEncode有两种常见方式,一种是基于GB2312的 Encode(Baidu.Yisou等搜索引擎使用),另一种是基于UTF ...

  3. GitHub与VS2013完成项目管理

    https://github.com 程序员应该去注册一个账号的网站 1.创建一个仓库 登录你的github网站:找到新建一个仓库的入口 一些基本信息填写完毕后,点击创建,即可拥有一个仓库 2. 让V ...

  4. .NET MVC 插件化框架支持原生MVC的Area和路由特性

    前面开放的源码只是简单的Plugin的实现,支持了插件的热插拔,最近晚上偶然想到,原生的MVC提供Areas和RouteAtrribute等路由特性标签,按照先前的做法,无法解析插件的路由特性和Are ...

  5. 复杂事件处理引擎—Esper 处理模型

    1.esper的处理模型是持续性的——根据statement中事件流(event stream).视图(views).过滤器(filters)等的选择,esper引擎一旦处理事件数据,就会变更stat ...

  6. Linux查看机器是多少位

    命令: file /bin/ls或者file /sbin/init 示例: 如上所示,我的机器是32位的.

  7. 通过MYSQL命令行直接建数据库

    因为同事要求,在进行MYSQLDUMP的导入库时,加一个日期标签, BUT,MYSQLDUMP的前提是数据库中要存在数据库名, 于是通过-e 参数执行命令. 这让我想起了前不久请教同事,如果AWK传变 ...

  8. 不建议用wxWidgets,底层有过多的bug

    不建议用wxWidgets, 搞了wxWidgets 3年,不是所说的那么容易跨平台,很多bug,不稳定, 莫名其妙的崩溃找源代码修改编译真是费时费力. 开发速度真没有使用本地sdk开发高, 很难定制 ...

  9. python手记(38)

    runfile(r'K:\testpro\testopencv.py', wdir=r'K:\testpro') http://blog.csdn.net/myhaspl myhaspl@qq.com ...

  10. COJ 1010 WZJ的数据结构(十) 线段树区间操作

    传送门:http://oj.cnuschool.org.cn/oj/home/problem.htm?problemID=1001 WZJ的数据结构(十) 难度级别:D: 运行时间限制:3000ms: ...