AngulJS简介
- 谷歌公司动态为web应用设计的JavaScript框架，为了克服HTML在构建应用上的不足。
- 它可通过
<script>标签添加到HTML页面。 - AngularJS通过指令拓展了HTML，且通过表达式绑定数据到HTML。
AngularJS 四大核心思想
依赖注入、模块化、双向绑定、语义化标签
AngularJS 的优点：
- 不需要写大量代码，实现复杂功能；
- 不要像jQuery大量操作复杂DOM代码，只需改变数据模型，加快开发。
什么是AngularJS？
AngularJS 使得开发现代的单一页面应用程序（SPAs：Single Page Applications）变得更加容易。
- AngularJS 把应用程序数据绑定到 HTML 元素。
- AngularJS 可以克隆和重复 HTML 元素。
- AngularJS 可以隐藏和显示 HTML 元素。
- AngularJS 可以在 HTML 元素”背后”添加代码。
- AngularJS 支持输入验证。
AngularJS前端MVC的设计与搭建
为什么需要MVC？
1、代码规模越来越大，切分职责是大势所趋。
2、为了复用：很多逻辑是一模一样的。
3、为了后期维护方便：修改一块功能不影响其他功能。
MVC只是手段，终极目标是模块化和复用。
前端MVC的困难：
流程：浏览器加载脚本->加载完成之后JIT编译执行
操作DOM的代码必须等待整个页面全部加载完成；
多个JS文件之间如果出现相互依赖，程序猿必须自己解决；
JS的原型继承也给前端带来了很多困难
M：模型model-数据库 ； V：视图-HTML页面 ； C：控制器-处理用户交互
MVC框架
<body ng-app="app"> //ng-app:设置aglJS管理边界
<div ng-controller="MyCtrl"> //ng-controller:设置控制器 V视图
<input ng-model="msg"> //ng-model:把元素值(比如输入域的值)绑定到应用程序
<h1>{{msg}}</h1> //{{}}:将msg绑定到h1
</div>
</body>
<script type="text/javascript">
angular.module('app',[]) //[]为其他aglJS模块，使用需引入该模块js
.controller('MyCtrl',function($scope){
$scope.msg="angular" //数据模型
})
</script>注：MyCtrl为控制器（C）；body为视图（V）；
module定义了AngularJS应用，Controller用于控制AngularJS应用。
什么是AngularJS？
AngularJS 使得开发现代的单一页面应用程序（SPAs：Single Page Applications）变得更加容易。
- AngularJS 把应用程序数据绑定到 HTML 元素。
- AngularJS 可以克隆和重复 HTML 元素。
- AngularJS 可以隐藏和显示 HTML 元素。
- AngularJS 可以在 HTML 元素”背后”添加代码。
- AngularJS 支持输入验证。