$routeParams传递路由参数
$routeParams传的值是一个对象数组。
案例:
index.html
<!DOCTYPE html>
<html lang="zh-cn" data-ng-app="myApp">
<!--myApp这里要和module模型里的名称一样-->
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width,initial-scale=1">
<meta http-equiv="X-UA-Compatible" content="IE=Edge">
<title>angularjs</title>
<link rel="stylesheet" href="bootstrap/css/bootstrap.css" />
<link rel="stylesheet/less" href="styles/site.less">
<script src="scripts/jquery.js"></script>
<script src="bootstrap/js/bootstrap.js"></script>
<script src="scripts/less.js"></script>
<!--<script src="scripts/angular-1.2.5.js"></script>-->
<script src="../../angular.js"></script>
<!--路由-->
<script src="scripts/angular-route.js"></script>
<!--控制器-->
<script src="controller1.js"></script>
<!--模型-->
<script src="module.js"></script>
</head>
<body class="container">
<header class="page-header"><h1>index</h1></header>
<section>
<div class="col-sm-6">
<a class="btn btn-danger btn-block" href="#one">1</a>
</div>
<div class="col-sm-6">
<a class="btn btn-primary btn-block" href="#two">2</a>
</div>
</section> <section>
<div ng-view>
占位符
</div>
</section>
</body>
</html>
index.html
one.html
<div>
第一个页面
</div>
<p>
{{title}}
</p>
<form action="">
<div class="form-group">
<label class="control-label" for="name">姓名:</label>
<input ng-model="name" type="text" id="name" class="form-control">
</div>
<div class="form-group">
<label class="control-label" for="pass">密码:</label>
<input ng-model="pass" type="text" id="pass" class="form-control">
</div>
<p>
<a href="#two?name={{name}}&pass={{pass}}" class="btn btn-primary">提交</a>
</p>
</form>
one.html
two.html
<div>
第二个页面
</div>
<div>
{{name}}{{pass}}
</div>
two.html
控制器
function textOne($scope) {
$scope.title="用户登录"
}
function textTwo($scope,$routeParams) {
console.log($routeParams);
$scope.name = $routeParams.name;
$scope.pass = $routeParams.pass;
}
controller.js
模块
//定义模块
var app = angular.module("myApp",['ngRoute']); //配置驱动类
app.config(["$routeProvider",function ($routeProvider) {
$routeProvider
.when("/one",{
templateUrl:"one.html",
controller:"oneCtrl"
})
.when("/two",{
templateUrl:"two.html",
controller:"twoCtrl"
})
.otherwise({
redirectTo:"/one"
})
}]); //添加控制器
app
.controller("oneCtrl",textOne)
.controller("twoCtrl",textTwo);
module
随机推荐
- 为什么说Kindle难圆“中国梦”? 支撑Kindle模式成功的要素,在当下中国并不太具备
http://www.huxiu.com/article/12993/1.html 6月7日更新:Kindle入华终于尘埃落定,苏宁将在下午4点在北京30家店面同时销售,首批产品为Kindle Pap ...
- (MVC)从客户端中检测到有潜在危险的 Request.Form 值
在传统的.net Request验证中 ,只需要在WebConfig HttpRuntime节点 加入 RequestValidateMode 属性,值为2.0(此处2.0并非Framework版本) ...
- C语言初级链表(之有头节点的单向链表)
#define _CRT_SECURE_NO_WARNINGS #include <stdio.h> #include <stdlib.h> typedef struct No ...
- .NET面试题(一)
1.请编程遍历页面上所有TextBox控件并给它赋值为string.Empty? foreach (System.Windows.Forms.Control control in this.Contr ...
- PHP $_SERVER 变量
$_SERVER 数组元素 $_SERVER 是一个包含诸如头信息(header).路径(path)和脚本位置(script locations)的数组.它是 PHP 中一个超级全局变量,我们可以在 ...
- SQL 2005示例库(转载)
sql2005数据库实例 从网上找还得麻烦,转了过来,点击就可以下载! 在学习SQL2005中离开不了SQL2005示例数据库,AdventureWorks数据库下载安装,,northwind数据库下 ...
- mybatis中分页查询
1 如果在查询方法中有多个参数,可以使用map对象将所有数据都存储进去.比如分页查询,需要用到两个参数,可以将这两个参数包装到map中. 例子:分页查询 dao层方法 public List<S ...
- navigate
一.router.navigate的使用 navigate是Router类的一个方法,主要用来跳转路由. 函数定义: ? 1 navigate(commands: any[], extras?: Na ...
- CentOS6.6+Puppet3.7.4分布式部署Nagios监控系统
测试框架 ? 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 CentOS-6.6-x86_64(minimal) puppet-3.7 ...
- Android4.4的zygote进程(下)
3.2.4启动Android系统服务——startSystemServer() 接下来就是启动Android的重头戏了,此时ZygoteInit的main()函数会调用startSystemServe ...