基本語法
上篇文章中，咱們已經對AngularJS基本語法有了初步的瞭解，接下來就一起繼續回顧一下它的基本語法，並對此有更深入的瞭解。這對以後的工作有很大的幫助，這些都是基礎，基礎打牢了才能更好的學習後面比較難的東西。
首先，我們已經清楚AngularJS的幾個最基礎的指令，指令是Angular中使用比較多的一個部分，Angular中的內置指令都是ng-開頭的一種特殊的語法結構，如:ng-app等，常見的基本指令如下：
ng-app( 定義一個 AngularJS 應用程序。是AngularJS應用程序運行的入口)
ng-init:用於在程序運行的過程中，初始化一些變量的數據的操作
ng-controller(定義應用的控制器對象，將一個標籤和控制器進行綁定，控制器中的數據，就可以使用在這個標 籤的內部了；控制器指令，用於在頁面中指定控制器作用範圍，通常作爲屬性出現）
ng-model(用來將表單元素的數據和變量雙向綁定，主要用於表單元素上的數據綁定 )
mustache語法{{ }} 雙大括號中，可以直接寫變量名稱，和變量的數據綁定，變量的數據發生改變，頁面的數據 會同時改變
ng-bind(指令告訴 AngularJS 使用給定的變量或表達式的值來替換 HTML 元素的內容。這是單向綁定的，用於將 變量的數據顯示到頁面上，用於替代mustache語法的)。
ng-[event]:事件指令，用於在頁面中發生某些事件時調用指令的函數
這樣我們就可以很清晰地在HTML中引進 AngularJS的指令了。接下來具體分析一下：
1、引導程序
任何應用程序，運行過程中都會有一個運行的入口。
AngularJS應用程序也是一樣，正常情況下，引導Ag應用的入口程序有兩種：
=====》 ng-app指令
=====》 bootstrap手工引導
常規模式下，是通過ng-app指令引導Angular應用進行工作的。
網頁中引入Angular之後，程序運行時會自動查找ng-app指令並從這個入口開始加載編譯並解釋執行。
案例代碼：
通常，頁面中會定義ng-app熟悉來指定入口，在script中通過angular的module來加載ng-app指定的模塊
<html ng-app=”myApp”>
<script>
angular.module(“myApp”, []);
</script>
</html>
案例代碼：某些特殊情況下，也可以通過腳本來動態控制加載啓動Angular應用，通過angular.bootstrap(dom, module)來啓動應用
<html>
<div id=”myDiv”></div>
<script>
angular.module(“myApp”, []);
var _div = document.getElementById(“myDiv”);
angular.bootstrap(_div, “myApp”);
</script>
</html>
2、深入基礎語法結構
開始深入學習AngularJS之前，先簡單認識AngularJS中的各個部分都是怎麼定義和使用的，方便解決後續學習過程中的一些 困擾。
ng-app
Angular應用運行的入口指令，常規情況下，是寫在我們前端項目的入口文件的跟標籤上的，用於在項目啓動的時候引導Angular應用
angular.module(..)
Angular是通過模塊來管理我們前端項目中的數據的，通常情況下一個項目中會包含各種各樣的數據，如管理員、會員、商品列表、商品、新聞列表、新聞、公告等等；
模塊時需要在應用啓動的時候就需要加載的，所以Angular在設計的過程中對於入口指令進行了改造可以綁定一個值，這個值就是系統的主模塊
$scope作用域
$scope是放在控制器函數中的一個參數。這個參數不需要傳值，而是angular自動賦值。
在操作的過程中$scope就相當於一個容器，可以在$scope上聲明變量或者函數，$scope上的變量和函數會自動和視圖頁面中的變量進行綁定，稱爲$scope掛載數據。
$rootScope作用域
$rootScope是AngularJS的根作用域，也是全局作用域，放在控制器函數中的一個參數，參數不需要傳值，angular會自動賦值，掛載在$rootScope上的數據，會被Angular應用中的所有模塊下的子模塊和控制器公用。
run()函數
配合$rootScope使用，用於聲明和初始化全局數據
app.run(function($rootScope) { // 處理代碼})
$scope.$watch()
掛載在$scope上，用於監控數據的變化
監控單個變量：$scope.$watch(“name”, function() {// 處理代碼})
監控多個變量：$scope.$watch(“name1 + name2 + ..” + function() {})
3、擴展
什麼是MVC處理模式？
MVC不是一個技術，是一種處理問題的思路，也就是編程思想。
這種編程思想的核心是將數據和展示分離，通過控制器掛載並進行一定的功能邏輯的處理以達到讓代碼具備強大的擴展性的目的。
MVC中主要包含三個模塊
View:視圖——用於數據的展示和交互
Model:數據模型——用與數據的封裝和運算
Controller:控制器——用於對視圖和數據模型之間的聯繫進行邏輯關係的處理
擴展：MVC和MVP
MVC是傳統的處理模式，但是隨着近年來前端技術發展迅速，數據雙向綁定處理模式的出現，傳統的MVC也進行了細化，出現了MVP處理模式
MVC:視圖view和數據模型model的數據是雙向綁定的，控制器只是作爲提供邏輯處理服務的中間件
MVP:視圖view和數據模型model的數據是單向綁定的，控制器作爲視圖view和數據模型model之間傳遞數據和邏輯處理的橋樑
常規情況下，由於MVC處理模式下數據雙向綁定造成的數據源的污染，以及view對於model嚴重的依賴性，所以建議在mvc處理模式下，複雜業務的數據的傳遞和邏輯處理過程還是通過控制器進行，而不是直接綁定。
這些擴展也是需要大家學習的。
再來給大家分享一個先寫的代碼 關於整個基本結構的，掌握了這些就可以進行進一步的學習了。
<!DOCTYPE html>
<!--
1. HTML自定義屬性 ng-app屬性
作用：用於啓動AngularJS應用程序
2. AngularJS號稱模塊化，組件化項目開發的框架
模塊/組件：積木
根模塊：通過ng-app的屬性值來指定【指定的是名稱】--指定了一個myApp的模塊
-->
<html ng-app="myApp">
<head>
<meta charset="UTF-8">
<title>Title</title>
<script src="angular.min.js"></script>
</head>
<body>
<!--
6. 基礎語法：通過ng-controller來將控制器和對應的標籤綁定
定義好了控制器的作用範圍【開始標籤~結束標籤之間】
-->
<div ng-controller="myCtrl" ng-init="count=1">
<!--
7.基礎語法結構：
mustache語法~ 通俗的說，就是雙大括號！
用於輸出變量的數據、進行數據的運算等等
但是mustache語法，由於加載如果緩慢的情況會出現直接將大括號打印到頁面上的問題
所以通常項目開發時，使用ng-bind來代替
-->
<!--
8. ng-init這個東西，主要用來在標籤中初始化一些變量數據【不推薦】
-->
{{name}} | <sapn ng-bind="name"></sapn>
{{count}} | <span ng-bind="count"></span>
</div>
<hr>
<div>
{{name}}
{{count}}
</div>
<script>
/* 3. 定義模塊 */
var app = angular.module("myApp", []);
/* 4. 定義控制器 */
/* 5. 控制器的參數$scope 是不需要傳遞數據的，AngularJS會自動給它賦值
* $scope上可以掛在數據，用於當前控制器的範圍
* */544
app.controller("myCtrl", function($scope) {
$scope.name = "jerry";
});
</script>
</body>
</html>
一起重溫代碼，工作了會發現這些課程還是挺有意思的，這是深入來出分析Angular的基本結構，以後還會有驚喜噻~