-------------------------------------------------- -------------------------------------------------- -------
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>
隱藏與顯示的時候，我們要注意，賦值是不變的，取值是不需要加{{}}的
//列表默認隱藏
js:$scope.visible = true;
html:<div ng-hide="visible"></div>
html賦值：
1{{ }}==== 除index.html之外，其他頁面均可以使用這樣的賦值方法
<div>{{name}}</div>
{{ }}語法是AngularJS內置的模板語法，它會在內部$scope和視圖之間創建綁定。基於這個
綁定，只要$scope發生變化，視圖就會隨之自動更新。
事實上它也是指令，雖然看起來並不像，實際上它是ng-bind的簡略形式，用這種形式不需
要創建新的元素，因此它常被用在行內文本中。
注意，在屏幕可視的區域內使用{{ }}會導致頁面加載時未渲染的元素發生閃爍，用ng-bind
可以避免這個問題。
<body ng-init="greeting='HelloWorld'">
{{ greeting }}
</body>
在線示例：http://jsbin.com/ODUxeho/1/edit。
2 ng-bind==index.html中一般使用這個，不用{{}}
盡管可以在視圖中使用{{ }}模板語法（AngularJS內置的方式），我們也可以通過ng-bind
指令實現同樣的行為。
<body ng-init="greeting='HelloWorld'">
<p ng-bind="greeting"></p>
</body>
在線示例：http://jsbin.com/esihUJ/1/edit。
HTML加載含有{{ }}語法的元素后並不會立刻渲染它們，導致未渲染內容閃爍（Flash of
Unrendered Content，FOUC）。我可以用ng-bind將內容同元素綁定在一起避免FOUC。內容會被
當作子文本節點渲染到含有ng-bind指令的元素內。
3 ng-cloak index.html中也可以使用這樣的方法
除使用ng-bind來避免未渲染元素閃爍，還可以在含有{{ }}的元素上使用ng-cloak指令：
<body ng-init=" greeting='HelloWorld'">
<p ng-cloak>{{ greeting }}</p>
</body>
ng-cloak指令會將內部元素隱藏，直到路由調用對應的頁面時才顯示出來。
以上為賦值單個， 以下為賦值多個
ng-bind-template
同ng-bind指令類似，ng-bind-template用來在視圖中綁定多個表達式。
<div
ng-bind-template="{{message}}{{name}}">
</div>