AngularJs练习Demo16 ngRoute
<!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的更多相关文章
- AngularJS 路由：ng-route 与 ui-router
AngularJS的ng-route模块为控制器和视图提供了[Deep-Linking]URL. 通俗来讲,ng-route模块中的$routeService监测$location.url()的变化, ...
- angularjs之插件ngRoute和ngAnimate
使用ngRoute和ngAnimate配合使用,可以实现页面切换的效果. 如果有使用过swiper,就知道这个效果是怎么样的. 代码: <!DOCTYPE html> <html l ...
- AngularJS Best Practices: ngRoute
app/----- components/---------- users/--------------- controllers/-------------------- users.control ...
- AngularJs练习Demo17 ngRoute
<!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" content ...
- [AngularJS] AngularJS系列(2) 中级篇之路由
目录 原理 angular-route ui-router 事件 深度路由 原理 ng的route本质是监听hashchange事件. 在angular-route中 $rootScope.$on(' ...
- angularjs 路由回退，返回到上一个路由
在现阶段比较流行的angularjs框架中:路由是一个比较重要的应用:angularjs的单页面是其强大功能之一: 所有的页面其实就只是在一个页面就实现的:angularjs通过对路由的控制来进行页面 ...
- AngularJS基础总结
w3shools angularjs教程 wiki <AngularJS权威教程> Introduction AngularJS is a JavaScript framewo ...
- ngRoute 和 ui.router 的使用方法和区别
在单页面应用中要把各个分散的视图给组织起来是通过路由机制来实现的.本文主要对 AngularJS 原生的 ngRoute 路由模块和第三方路由模块 ui.router 的用法进行简单介绍,并做一个对比 ...
- AngularJs轻松入门（七）多视图切换
在AngularJs应用中,我们可以將html碎片写在一个单独的文件中,然后在其他页面中將该段碎片加载进来.如果有多个碎片文件,我们还可以在控制器中根据用户的操作动态的加载不同的碎片,从而达到切换视图 ...
随机推荐
- HTML5 canvas 合成属性
合成属性 globalAlpha 设置或返回绘图的当前 alpha 或透明值 globalCompositeOperation ...
- Centos 6.5 搭建php环境(nginx+mariadb+php7)
1.mariaDb vim /etc/yum.repos.d/MariaDB.repo [mariadb] name = MariaDB baseurl = http://yum.mariadb.or ...
- Python Socket Programming
本文介绍使用Python进行Socket网络编程,假设读者已经具备了基本的网络编程知识和Python的基本语法知识,本文中的代码如果没有说明则都是运行在Python 3.4下. Python的sock ...
- jquery keyup 在IOS设备上输入中文时不触发
今天做一个异步查询功能的时候发现在IOS设备上查询中文时keyup没有触发,在其他设备上时可以的,后来在stackoverflow上找到下面这种解决方法,贴出来算是抛砖引玉了. $h_input.on ...
- 数据分页SQL语句的比较
建立表 CREATE TABLE [TestTable] ( , ) NOT NULL , ) COLLATE Chinese_PRC_CI_AS NULL , ) COLLATE Chinese_P ...
- 最简单的ASP动态页面生成伪静态方法
目前网站制作中很多网站都采用生成静态页的方法,原因是这样访问速度会得到提高(服务器端CPU利用率很低),另外也容易被搜索引擎收录,但是这带来的一个问题就是需要足够大的空间存放这些静态页面,如果你的空间 ...
- javaWeb实现使用邮箱邮件找回密码功能
JSP+Jmail+JavaBean 发邮件(转)2010-08-23 18:052007年04月14日 14:32/* * SendMail.java * * Created on 2007年3月3 ...
- js只能输入数字
$("#SeatCount, #Charge").on("keyup", function () { if (this.value.replace(/^0|\D ...
- Altium Design 中差分走线的设置
1.在原理图中,将要设置的差分对的网络名称的前缀取相同的名字,在前缀后面加后缀分别为_N 和_P,并且加上差分对指示.具体操作如下:2.在原理图界面下,单击 Place>>Directiv ...
- 一道面试题与Java位操作 和 BitSet 库的使用
前一段时间在网上看到这样一道面试题: 有个老的手机短信程序,由于当时的手机CPU,内存都很烂.所以这个短信程序只能记住256条短信,多了就删了. 每个短信有个唯一的ID,在0到255之间.当然用户可能 ...