AngularJS
- 什麼是AngularJS
AngularJS： 是一款由Google維護的開源JavaScript庫 - 使用AngularJS的優點：
- 雙向數據綁定
- 代碼模塊化
- 依賴注入，將這種後端語言的設計模式賦予前端代碼，這意味着前端的代碼可以提高重用性和靈活性，未來的模式可能將大量操作放在客戶端，服務端只提供數據來源和其他客戶端無法完成的操作
-
AngularJS指令
AngularJS 通過被稱爲 指令 的新屬性來擴展 HTML。 通過內置的指令來爲應用添加功能。允許自定義指令。
舉例如下：
<div ng-app="" ng-init="firstName='名字'">
<p>在輸入框中嘗試輸入:</p>
<p>姓名: <input type="text" ng-model="firstName"></p>
<p>你輸入的爲: {{ firstName }}</p>
</div>
-
數據綁定
AngularJS中通過ng-module實現數據綁定 -
click事件
<body>
<div ng-app="myApp" ng-controller="myCtrl">
<button ng-click="count = count + 1">點按鈕加1</button>
<p>{{ count }}</p>
</div>
<script>
var app = angular.module('myApp', []);
app.controller('myCtrl', function($scope) {
$scope.count = 0;
});
</script>
</body>
- 使用Angular實現計算器功能
![在這裏插入圖片描述]()
效果截圖如下：
![在這裏插入圖片描述]()
Angular-cli（腳手架）
Angular CLI 是一個命令行接口(Angular Command Line Interface)，用於實現自動化開發工作流程。能讓開發者更容易搭建和運行Angular工程。
- 安裝Angular-cli
# window平臺上使用如下命令
npm install -g @angular/cli
- 創建腳手架項目
ng new <name> [options]
ng n <name> [options]
- 運行服務器
ng serve
- 目錄結構及文件含義
![在這裏插入圖片描述]()
