AngularJS简介
一、什么是AngularJS
AngularJS是 Google 开源出来的一套 js 工具, 是一个 JavaScript 框架。它可通过 <script> 标签(标签应该置于页面底部,避免加载angularjs而阻挡HTML加载)添加到 HTML 页面。AngularJS是一个为动态WEB应用设计的结构框架,创新点在于,利用数据绑定和依赖注入,使你不用再写大量的代码。
二、AngularJS的特点
- 双向数据绑定——从界面的操作能实时反映到数据,数据的变更能实时展现到界面;
- 模板——在angularjs中,模板相当于html文件被浏览器解析到DOM中,angularjs遍历这些DOM,也就是说把模板当做DOM来操作,去生成一些指令来完成对view的数据绑定。
- MVVM —— 吸收了传统的MVC设计模式但又不是传统意义上的MVC,更接近于MVVM(Moodel-View-ViewModel)。
- 依赖注入 —— AngularJS拥有内建的依赖注入子系统,可以帮助开发人员更容易的开发,理解和测试应用。
- 指令 —— 可以用来创建自定义的标签,也可以用来装饰元素或者操作DOM属性。
三、为什么用AngularJS
1.AngularJS提供了强大的模板功能,提供很多的AngularJS的指令,还可以自定义指令;
2.不需要直接操作元素,而是基于DOM操作;
3.实现了依赖注入;
四、使用AngularJS
1.创建AngularJS的index.html
<html>
<html ng-app="myApp">
<head>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.0.7/angular.min.js"></script>
<script src="js/main.js"></script>
</head>
<body>
</body>
</html>
2.创建所需的main.js
在main.js文件里来定义我们的AngularJS模块:
var app = angular.module('myApp', []);
应用的名字作为ng-app指令的值,我们就可以在index.html页面上实例化我们的应用(模块)<html ng-app="myApp">
我们可以把ng-app设在任何DOM元素上,然后该元素就会成为AngularJS启动运行我们应用的地方
例:
<h2>I am not inside an AngularJS app</h2>
<div ng-app="myApp">
<h3>Inside an AngularJS app</h3>
</div>
以上是 AngularJS基本的介绍和操作,下节我们在深入理解。