AngularJS的相關應用
一.【AngularJS常用指令】
1、ng-app:聲明Angular所管轄的區域。一般寫在body或html上,原則上一個頁面只有一個;
<body ng-app=""></body>
2、ng-model:把元素值(比如輸入域的值)綁定到應用程序的變量中。
<input type="text" ng-model="name"/>
3、ng-bind:把應用程序變量中的數據綁定到 HTML視圖中。可用表達式{{ }}替代;
<div ng-bind="name"></div>
4、ng-init:初始化 AngularJS應用程序中的變量。
<body ng-app="" ng-init="name=123">
5、表達式: {{}} 綁定表達式,可以包含文字、運算符和變量。但表達式在網頁加載瞬間會看到{{}},所以可以用ng-bind=""替代
{{ 5 +""+ 5 + ‘,Angular‘}}
二.【服務Service】
1、內置服務:
$location:返回當前頁面的 URL地址。
$http:向服務器發送請求,應用響應服務器傳送過來的數據,類似於Ajax
$timeout:相當於setTimeout();
$interval:相當於setInterval();
三.AngularJS中,過濾器可以使用一個管道字符(|)添加到表達式和指令中。
>>> 系統內置過濾器:
filter 從數組項中選擇一個子集。
lowercase 格式化字符串為小寫。
orderBy 根據某個表達式排列數組。
uppercase 格式化字符串為大寫。
四 AngularJS中select和表格
使用數組作為數據源。
其中,x表示數組的每一項。
默認會將x直接綁定到option的value中。
而option顯示的內容,有前面的x for... 決定
-->
<!--<select ng-model="name" ng-options="x.site for x in sites">
</select>-->
<!--
使用對象作為數據源.
其中,(x,y)表示鍵值對,x為鍵,y為值。
默認會將值y綁定到option的value中.
而option顯示的內容,有前面的x for... 決定
AngularJS的相關應用