作用
主要为web应用程序设计
四个核心思想
- 依赖注入
- 模块化
- 双向绑定
- 语义化
工作
通过指令扩展HTML,通过表达式绑定HTML。
- 通过ng-directions来实现扩展
- ng-app实现定义一个应用程序
- ng-model实现把元素值绑定到应用程序
- ng-bind实现把数据绑定到HTML视图
实例介绍
- 首先在需要使用angularJS的地方定义ng-app
- 然后使用ng-model和ng-bind把元素的值和HTMl绑定
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<script src="http://apps.bdimg.com/libs/angular.js/1.5.0-beta.0/angular.min.js"></script>
</head>
<body>
<div ng-app="">
<p>名字 : <input type="text" ng-model="name"></p>
<h1>Hello {{name}}</h1>
</div>
</body>
</html>
ng-init
作用:赋初值。
可以理解为你在写js的时候的var variable;
<div ng-init="firstName='John'">
<p>姓名为 <span ng-bind="firstName"></span></p>
此时,John将被直接显示在span标签里。
关于data-ng-
data-ng-使得HTMl5也可以使用扩展angularjs
关于angularjs的表达式
语法:{{代码}}
表达式的作用是把数据绑定到HTML,这个和ng-bind的是一样的。
angularjs的表达式和js的表达式一样,可以包含字符,字符串等。
下面是一个表达式的例子:
<div>
<p>输出:{{5+5}}</p>
</div>
在页面显示的结果也就是10.