AngularJS 實例


實例

您可以線上編輯實例,然後點擊按鈕查看結果。

AngularJS 實例

<div ng-app=""> <p>名字 : <input type="text" ng-model="name"></p> <h1>Hello {{name}}</h1> </div>



AngularJS 基礎

我的第一個 AngularJS 運算式
我的第一個 AngularJS 指令
我的第一個 AngularJS 指令(帶有有效的 HTML5)
AngularJS 控制器

基礎的 AngularJS 講解


AngularJS 運算式

簡單的運算式
不使用 ng-app 的運算式
帶有數字的運算式
使用帶有數字的 ng-bind
帶有字串的運算式
使用帶有字串的 ng-bind
帶有對象的運算式
使用帶有對象的 ng-bind
帶有數組的運算式
使用帶有數組的 ng-bind

運算式講解


AngularJS 指令

AngularJS 指令
ng-model 指令
ng-repeat 指令(帶有數組)
ng-repeat 指令(帶有對象)

指令講解


AngularJS 控制器

AngularJS 控制器
控制器屬性
控制器函數
JavaScript 檔中的控制器 I
JavaScript 檔中的控制器 II

控制器講解


AngularJS 篩檢程式

運算式篩檢程式 uppercase
運算式篩檢程式 lowercase
貨幣篩檢程式運算式
指令篩檢程式 orderBy
輸入篩檢程式

篩檢程式講解


AngularJS XMLHttpRequest

讀取靜態 JSON 檔

XMLHttpRequest 解析


AngularJS 表格

顯示一個表格 (簡單)
帶有 CSS 樣式的表格
表格排序
使用 uppercase 篩檢程式的表格
使用序號的表格
使用 even 和 odd 表格


AngularJS - 從資料庫中讀取數據

從 MySQL 資料庫中讀取數據
從 SQL Server 資料庫中讀取數據

AngularJS SQL 解析


AngularJS HTML DOM

ng-disabled 指令
ng-show 指令
ng-hide 指令

HTML DOM 解析


AngularJS 事件

ng-click 指令
ng-hide 指令
ng-show 指令

HTML 事件解析


AngularJS 模組

在 body 中的 AngularJS 模組
在檔中 AngularJS 模組

AngularJS 模組解析


AngularJS 表單

AngularJS 表單
AngularJS 驗證

AngularJS 表單解析


AngularJS API

AngularJS angular.lowercase()
AngularJS angular.uppercase()
AngularJS angular.isString()
AngularJS angular.isNumber()

API 解析


AngularJS Bootstrap

AngularJS 使用 Bootstrap
AngularJS 使用 Bootstrap 並使用包含檔功能

Bootstrap 解析


AngularJS 應用

AngularJS 筆記應用
AngularJS 備忘錄應用

AngularJS 應用