功能
- AngularJS 把应用程序数据绑定到 HTML 元素。
- AngularJS 可以克隆和重复 HTML 元素。
- AngularJS 可以隐藏和显示 HTML 元素。
- AngularJS 可以在 HTML 元素”背后”添加代码。
- AngularJS 支持输入验证。
特性
- MVC
- 模块化与依赖注入
- 双向数据绑定
- 指令与 UI 控件
使用简单例子-双向绑定
要引入angularjs.js
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<script src="style/js/angular.min.js"></script>
<title>双向绑定</title>
</head>
<body>
<div ng-app="">
<p>双向绑定</p>
<input tyle="text" ng-model="name">
// <div ng-bind="name"<</div<
// 第二种写法（注意，因为加载页面时有时会显示{{}}）
{{name}}
</div>
</body>
</html>
Angularjs 中常用名词 也就是所说的常用指令
ng_app 定义应用程序的根元素，即应用程序的‘所有者’。 指令
ng_bind 指令把应用程序变量 name 绑定到某个段落的 innerHTML。 指令
ng_model 指令把输入域的值绑定到应用程序变量 name。 指令
ng_click 定义元素被单击时的行为。 HTML 事件
ng_controller 为应用程序定义控制器对象。 控制器
ng_disabled 绑定应用程序数据到HTML的disabled 属性。HTML DOM
ng_init 为应用程序定义初始值（通常情况下，不使用 ng-init。您将使用一个控制器或模块来代替它）。 指令
ng_repeat 为控制器中的每个数据定义一个模板。 指令
ng_show 显示或隐藏 HTML 元素。 HTML DOM
当网页加载完毕，Angularjs 自动开启
<div ng-app="">
//ng-init 变量
<div ng-init="sex1='男'">
{{sex1}} //男
</div>
//ng-init 与 data-ng-init 等价
<div data-ng-init="sex2='女'">
{{sex2}} //女
</div>
//Angularjs 表达式 {{}} : 数字
<div ng-init="a=2; b=3">
{{a*b}} //6
</div>
//字符串
<div ng-init="a='aa'; b='bb'">
{{a + b}} //aabb
</div>
//对象
<div ng-init="person={fristName:'json', lastName:'tom'}">
{{person.lastName}} //tom
</div>
//数组
<div ng-init="arr=[1,5,9,14]">
第三个值为{{arr[2]}} //9
</div>
</div>
![【angular】环境搭建及遇到的问题[图]](data:image/gif;base64,R0lGODlhAQABAIAAAP///wAAACwAAAAAAQABAAACAkQBADs=)