黑马程序员技术交流社区

标题: web前端培训教程之AngularJs教程：第二天 [打印本页]

---

作者: 童瑞凯老师    时间: 2017-6-14 17:33
标题: web前端培训教程之AngularJs教程：第二天

AngularJS 起步

AngularJS 是一个 JavaScript 框架，所以你可以通过以下两种方式载入到页面中：

下载 Angular.js 的包

https://github.com/angular/angular.js/releases

使用CDN上的angular.js

http://apps.bdimg.com/libs/angular.js/1.4.6/angular.min.js

Hello world

创建一个新的HTML文件，贴入以下代码：

直接启动在浏览器中查看。

体会AngularJS在这个过程中完成那些事情。

案例解析

当网页加载完毕，AngularJS 自动开启。

ng-app 指令告诉 AngularJS，<div>元素是 AngularJS 应用程序 的"所有者"。

ng-model 指令把输入域的值绑定到应用程序变量 name。

{{ name }}表达式把应用程序变量 name 绑定到某个段落的 innerHTML。

MVC

MVC是一种应用程序的开发思想

主要目的是为了解决应用程序展示结构，业务逻辑之间的紧耦合关系

使应用程序的组成分为三个部件，每个部件有自己明确的职责，相互之间没有依赖

MVC 组成

模块（Module）

AngularJS很重要的一个特性就是实现模块化编程，我们可以通过以下方式创建一个模块，

也可以将重复使用的指令或过滤器之类的做成模块便于复用

注意必须指定第二个参数，否则变成找到已经定义的模块

控制器（Controller）

业务逻辑的集合

控制器的三种主要职责：

为应用中的模型设置初始状态

通过$scope对象把数据模型或函数行为暴露给视图

监视模型的变化，做出相应的动作

---

欢迎光临 黑马程序员技术交流社区 (http://bbs.itheima.com/)

黑马程序员IT技术论坛 X3.2