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 应用