AngularJs第一天
阿新 • • 發佈:2017-05-16
display sco static ssi pla live module apple 參考
http://www.runoob.com/angularjs/angularjs-tutorial.html(參考文檔)。
下載AngularJs的js包 https://github.com/angular/angular.js/releases,也可以點擊http://cdn.static.runoob.com/libs/angular.js/1.4.6/angular.min.js復制內容,粘貼到新的記事本中再重命名。
AngularJS簡介:
AngularJS 是一個 JavaScript 框架。它可通過 <script> 標簽添加到 HTML 頁面。
AngularJS 通過 指令 擴展了 HTML,且通過 表達式 綁定數據到 HTML。
AngularJS 應用:
AngularJS模塊(module)定義了AngularJS的應用
AngularJS控制器(controller)用於控制AngularJS應用
ng-app指令定義了應用,ng-controller定義了控制器
1 <!DOCTYPE html> 2 <html> 3 <head> 4 <meta charset="utf-8"> 5 <script src="http://cdn.static.runoob.com/libs/angular.js/1.4.6/angular.min.js"></script> 6View Code</head> 7 <body> 8 <div ng-app="myApp" ng-controller="myCtrl"> 9 名: <input type="text" ng-model="firstName"><br> 10 姓: <input type="text" ng-model="lastName"><br> 11 <br> 12 姓名: {{firstName + " " + lastName}} 13 </div> 1415 <script> 16 var app = angular.module(‘myApp‘, []); 17 app.controller(‘myCtrl‘, function($scope) { 18 $scope.firstName= "John"; 19 $scope.lastName= "Doe"; 20 }); 21 </script> 22 </body> 23 </html>
AngularJS 模塊定義應用:var app = angular.module(‘myApp‘, []);
AngularJS 控制器控制應用:
app.controller(‘myCtrl‘, function($scope) {
$scope.firstName= "John";
$scope.lastName= "Doe";
});
AngularJs第一天