JavaScript強化教程——AngularJS
- 2019 年 12 月 4 日
- 筆記
本文作者：IMWeb 王軍 原文出處：IMWeb社區 未經同意，禁止轉載
本文為 H5EDU 機構官方 HTML5培訓 教程，主要介紹：JavaScript強化教程 —— AngularJS
AngularJS 簡介
AngularJS 是一個 JavaScript框架。它可通過 [removed] 標籤添加到 HTML 頁面。
AngularJS 通過 指令 擴展了 HTML，且通過 表達式 綁定數據到 HTML。
AngularJS 是一個 JavaScript框架
AngularJS 是一個 JavaScript框架。它是一個以 JavaScript編寫的庫。
AngularJS 是以一個 JavaScript文件形式發布的，可通過 script標籤添加到網頁中：<script src="http://apps.bdimg.com/libs/ang … gt;[Note] 我們建議把腳本放在 <body> 元素的底部。 這會提高網頁載入速度，因為 HTML 載入不受制於腳本載入。
各個 angular.js 版本下載： https://github.com/angular/angular.js/releases
AngularJS 擴展了 HTML
AngularJS 通過 ng-directives 擴展了 HTML。
ng-app 指令定義一個 AngularJS 應用程式。
ng-model 指令把元素值（比如輸入域的值）綁定到應用程式。
ng-bind 指令把應用程式數據綁定到 HTML 視圖。
AngularJS 實例<!DOCTYPE html>
<html></p>
<head></p>
<meta charset="utf-8"></p>
<script src="http://apps.bdimg.com/libs/ang … gt; </head></p> <body>
名字 : <input type="text" ng-model="name"></p>
Hello {{name}}
</body> </html> 實例講解：
當網頁載入完畢，AngularJS 自動開啟。
ng-app 指令告訴 AngularJS，
元素是 AngularJS 應用程式 的"所有者"。
ng-model 指令把輸入域的值綁定到應用程式變數 name。
ng-bind 指令把應用程式變數 name 綁定到某個段落的。
[Note] 如果您移除了 ng-app 指令，HTML 將直接把表達式顯示出來，不會去計算表達式的結果。
什麼是 AngularJS？
AngularJS 使得開發現代的單一頁面應用程式（SPAs：Single Page Applications）變得更加容易。
AngularJS 把應用程式數據綁定到 HTML 元素。 AngularJS 可以克隆和重複 HTML 元素。 AngularJS 可以隱藏和顯示 HTML 元素。 AngularJS 可以在 HTML 元素"背後"添加程式碼。 AngularJS 支援輸入驗證。
