-----------------------------------------------------------------------------------------------------------
html中赋值:<button ng-click="showColor(‘green‘)">变色</button>
js中取值:
$scope.showColor=function($routeParams){
alert($routeParams)
}
-----------------------------------------------------------------------------------------------------------
html中赋值:<a href="#/detail/{{ book }}"> book={{ book }}<br/>
js中取值:$routeParams.book
book为属性名
------------------------------------------------------------------------------------------------------------------------------------------
浏览器中赋值:
http://localhost:8080/test/index.html#/hello
app.js中取值
var app =angular.module(‘bookStoreApp‘,[
‘bookStroreCtrls‘
]);
app.config(function($routeProvider){
$routeProvider.when(‘/hello‘,{
templateUrl:‘html/hello.html‘,
controller:‘HelloCtrl‘
})
.when(‘/hello‘,{
templateUrl:‘html/form/testFormCtrl.html‘,--------跳转到对应的html页面
controller:‘TestFormCtrl‘---------寻找对应的controller
})
.when(‘/list‘,{
templateUrl:‘html/bookList.html‘,
controller:‘BookListCtrl‘
})
.when(‘/detail/:book‘,{
templateUrl:‘html/detail.html‘,
controller:‘BookDetailCtrl‘
})
.otherwise({
redirectTo:‘/hello‘
})
});
-----------------------------------------------------------------------------------------------------------
Js中赋值:
/ng-bind在index.html首页的时候代替{{}}取值,在其他页面均用{{}}取值即可
1简单的赋值
$scope.hello="你好";
2 外层.内层赋值
$scope.hello={
someText:‘演示特性二:演示模块化‘
};
3 集合的赋值
$scope.books=[
{title:"书1",author:"作者1"},
{title:"书2",author:"作者2"},
{title:"书3",author:"作者3"}
]
$scope.names=[‘zhangsan‘,‘lisi‘,‘wangwu‘];
html中取值:
1简单的取值{{hello}}输出"你好"
2外层.内层取值{{hello.someText}}输出“演示特性二:演示模块化”
3 集合取值
<div ng-controller="listCtrol">
<table>
<tr ng-repeat=‘name0 in names‘>
<td >{{id}}-{{name}}—{{name0}}-{{department}} from {{names}}</td>
</tr><br/>
</table>
</div>
<ul>
<!-- 此处标签内放两个ng-repeat不会报错,只是起作用而已。当两个同时出现时,标签只认第一个 -->
<li ng-repeat="book in books" ng-repeat="name in names">
<a href="#/detail/{{ book }}"> book={{ book }}<br/>
title={{book.title}}<br/>
author={{book.author}}<br/>
names={{names}}<br/>
name={{name}}<!-- 此处无法显示 -->
</a>
</li>