AnjularJS-imooc学习笔记1

第一部分 快速上手
1.版本1.3.0
2.四大核心特性
  a.MVC
  b.模块化，一切（标签、控制器等）都从模块开始
  c.指令系统directive
  d.双向数据绑定（展示与DOM）
3.环境搭建
  a.轻量级服务器：nodeJS的http-server：将目录发布成网页，可以作为模拟数据源
  b.调试：chrome+batarang或者findbug
  c.代码合并和混淆：grunt
  d.依赖管理工具：bower
  e.单元测试：karma（浏览器环境）+jasmine（相当于JUnit）或者protractor（专为AnjularJS定制，测试语法也是使用的jasmine）




第二部分 基本概念和用法
一、MVC
1.MVC中的controller
  a.ng-app相当于main函数，因此只能有一个。
  b.ng-controller是控制器，通用功能通过service实现而不是继承公共的控制器。
  c.controller使用注意：
    -不复用，一个控制器只负责一个视图
    -不操作DOM，DOM操作使用directive实现
    -不做数据格式化，使用标签
    -不做数据过滤，使用$filter
    -不相互调用，应该通过事件触发调用
2.MVC中的model通过ng-model实现页面标签与后台变量的双向数据绑定，ng-bind用于后台到view的单项数据绑定。
3.MVC中的view通过directives实现。
4.Angular中的MVC是借助$scope实现的：
  a.$scope是树形结构，与DOM标签平行
  b.$scope对象会继承父scope的属性和方法。
  c.$scope位于$rootScope下（ng-app定义根rootscope）
  d.$scope可以传递事件（emit：向上，broadcast向下。均包含同级）


二、路由、模块、依赖注入
1.模块：一切都从模块开始
var modeluName = angular.module('name',[]);ioc的内容在[]中添加依赖。
2.路由：Angular提供路由机制ng-route
$rootProvider.when('/hello',{templateUrl:'tmpl/hello.html',controller:'HelloCtrl'}).otherwise...
3.一般项目模块切分：
  a.controllers：控制器
  b.directives：标签
  c.service：服务
  d.filter：过滤器
  e.routeProvider：路由
4.依赖注入：定义模块时[]引入。
5.双线数据绑定：
  a.双向：视图和model
  b.ng-model是双向数据绑定，ng-bind是model->view的数据绑定，{{}}用于数据显示，要求angular.js必须加载完毕，不然会显示出来{{}}中的内容，因此一般首页使用ng-bind（angular.js一般首页index加载）
  c.ng-class可以接受表达式，比原有class增强
  d.ng-show、ng-hide用于显示、隐藏数据，两者功能类似
  e.ng-view用于显示引用页面
  f.ng-animate用于控制动画
  g.ng-route用于路由，但是不利于多级控制，一般使用开元的UI-ROUTE代替。
  h.#锚点，用于页面内导航，是前端路由的一般方法。
PS:bootstrap是css框架，控件能力较弱，一般不用，主要使用其css定义。