認識 angularjs 及 angularjs 簡單實用
阿新 • • 發佈:2017-07-22
scope 功能 cti spa 過濾器 pac -c 開發 oct
Angular.js中,引入了專門的ViewModel(視圖模型)來實現View和Model的粘合,讓View和Model的進一步分離和解耦。
優勢:
1、低耦合
2、可重用性
3、獨立開發
4、可測試性
MVC
model view controller
模型-視圖-控制
數據-頁面-業務處理
視圖:直接用戶操作的頁面
模型:參與運算的所有數據(對數據進行過濾、篩選、排序、crud等操作)
控制:數據傳遞
angular.js的核心功能模塊
1、數據的綁定
2、過濾器
3、路由
4、作用域
5、指令集
6、模板
7、依賴註入
使用 angular.js
1 <!DOCTYPE html>
2 <html ng-app="myApp" ng-controller="myCtrl">
3 <!--
4 描述:在 HTML 頭部引入 ng-app="myApp" ng-controller="myCtrl"
5 -->
6 <head>
7 <meta charset="utf-8" />
8 <title>Angular.js的指令</title>
9 </ head>
10 <body>
11 <script src="js/angular.js"></script>
12 <script>
13 /*
14 * 在 js 代碼中引入 下列代碼即可使用 Angular.js
15 */
16 angular.module("myApp", []).controller("myCtrl", function($scope) {
17 // Angular.js 處理 函數 "myApp" 對應的是 ng-app 的值; "myCtrl" 對應的是 ng-controller 的值;
18 });
19 </script>
20 </body>
21 </html>
ng-app 指令初始化一個 AngularJS 應用程序。
ng-controller 指令用於為你的應用添加控制器。
認識 angularjs 及 angularjs 簡單實用