前言
今天來和大家學習一下AngularJS……
AngularJS 通過新的屬性和表達式擴展了 HTML。
AngularJS 可以構建一個單一頁面應用程序。
AngularJS 學習起來非常簡單。
一、AngularJS指令與表達式
【AngularJS常用指令】
1、ng-app:聲明Angular所管轄的區域，一般寫在body或HTML上，原則上一個頁面只有一個。
2、ng-model:把元素值（比如輸入域的值）綁定到應用程序的變量中。
eg:<input type="text" ng-model="name"/>
3、ng-bind:把應用程序變量中的數據綁定到HTML視圖中，可用表達式替代。
eg:<div id="div1" ng-bind="name">
</div>等效于<div id="div1" >{{name}}</div>
4、ng-init:初始化 AngularJS應用程序變量。
eg:<body data-ng-app="" ng-init="name=123">
5、表達式：{{}}綁定表達式，可以包含文字，運算符和變量。
但是表達式在網頁加載瞬間會看到{{}}，所以可以用ng-bind=""替代。
eg:{{ 5 + "" + 5 + ',Angular' }}
【基本概念】
指令：AngularJS中，通過擴展HTML的屬性提供功能。
所以，ng-開頭的新屬性，被我們成為指令。
二、AngularJS中的MVC中的作用域
【MVC三層架構】
1、model(模型):
應用程序中用于處理數據的部分。（保存或修改數據到數據庫、變量等）。AngularJS中的Model特指的是：數據。
View(視圖):用戶看到的用于顯示數據的頁面。
Controller(控制器):應用程序中處理用戶交互的部分。負責從視圖讀取數據，控制用戶輸入，并向模型發送數據。
2、工作原理：
用戶從視圖層發出請求，controller接收到請求后轉發給對應的model處理，model處理完成后返回結果給controller，并在View層反饋給用戶.
3、創建一個Angular模塊，即ng-app所綁定的部分 ,需傳遞兩個參數：
①模塊名稱：即ng-app所需要綁定的名稱，ng-app="myApp"
②數組：需要注入的模塊名稱，不需要可為空。
eg:var app= angular.module("myApp",[]);
在Angular模塊上，創建一個控制器Controller，需要傳遞兩個參數。
①Controller名稱，即ng-controller需要綁定的名稱。ng-controller="myCtrl"
②Controllerd的構造函數：構造函數可以傳入多個參數，包括$scope/$rootScope以及各種系統內置對象；
【AngularJS中的作用域】
①$scope：局部作用域，聲明在$scope上的屬性和方法，只能在當前的Controller中使用
②$rootScope：根作用域，聲明在$rootScope上的屬性和方法，
可以在ng-app所包含的任何區域使用（無論是否同Controller，或是否在Controller包含范圍中）
>>>若沒有使用$scope聲明變量，而直接在HTML中使用ng-model綁定的變量作用域為：
1、如果ng-model在某個ng-controller中，則此變量會默認綁定到當前Controller的$scope上;
新聞熱點
疑難解答
圖片精選
