AngularJS - 框架
********************
https://docs.angular.org & https://www.angularjs.net.cn
Angular 1.0 基于js 的架构 2.0 typescripts
基于MVC 模型架构.
*********************
A. 指令
A1 边界指令 ng-app
Angular 在引入Angular.js 之外, 还要为框架指明边界使用范围， 如果不适用边界指令，则引入angluar.js失效。通常在html 标签内，表明当前页面angular 都生效.
A2. 呈现指令 {{}}, 在花双括号中可以显示ng 的变量、表达式
A3 信息指令 ng-mode 作用域input textarea 保存用户输入信息的变量
A4 绑定指令 ng-bind 作用于非输入性标签的类似于{{}}指令
A5 初始化指令 ng-init 初始化变量 通常放于body
B. 控制器
B1 angular.module() 用于生成页面数据模型的方法 var xxx = angular.module(边界名称，[注入信息]）
var myApp=angular.module('app',[]) 此时myApp 就相当于DOM
B2 声明页面中控制器指令angular.controller （控制器用来操作视图和数据）
所有该页面的变量/事件/回调等脚本操作都写再2这个控制器中，也即完成了页面与脚本的分离.
只要声明了控制器标签，这个控制器就必须定义
B3. 实现控制器方法 页面数据模型.controller(‘控制器名称’,[$scope,funciton('$scope'{...})])
myApp.controller('mainController',[$scope, function('$scope'{....})]) 通过$scope全局变量可以访问相应的变量
B4. 事件监听
通过对标签内添加ng-事件名来实现该元素的事件监听，而事件监听的回调函数通过controller中$scope实现，类似于html的事件（写在scripts中）
在控制器方法中，
$scope.func= function (形参或空){
....
}
例子：
C 多控制器
模块化类似于div 思想，可以嵌套,外层变量可以给内层使用，一旦声明就必须通过.controller（）实现. 首页的通常将mainCotroller 作为唯一一个根控制器
D 路由
路由模块化.....
控制器之间传递变量
E: 服务
前面$rootScope 就是一种系统服务，提供跨控制器进行数据交互
可以这么认为，服务是一个名词，认为是全局变量。再ng框架中存在多种服务，可以系统服务（有$前缀,不需要定义服务的内容，可以直接注入到控制器中使用），也可以自定义服务（没有$前缀）。
E1 系统服务 $http 用于处理网路（包括ajax请求等）
....
app.controller('控制器名'，[$scope, $http,function($scope,$http){
//--- get ----
$http({
method:'GET',
url:'lesson4_httpservice.php' //<?php $success =array('msg'=>'ok','src'=>'mypic.jpg'); echo json($success); ?>
}).success(function(data){
console.log(data);
$scope.imgSrc=data.src;
}).error(function(err){
console.log(err);
});
}])
//post
$http({
method:'POST',
url:'lesson4_httpService.php',
headers:{
//"Content-Type":"multipart/form-data"
//"Content-Type":"applicaiton/json"
"Content-Type":"application/x-www-form-urlencoded",
data:'userName=Frank&password=123456'
}).success(function(data){
console.log(data);
$scope.imgSrc=data.src;
}).error(function(err){
console.log(err);
});
})
E2 过滤服务
$filter {{任意内容|过滤器}} $filter虽然是系统服务，但也支持自定义
支持4种过滤器
在控制器注入的地方可以添加$filter
app.controller('controllerName',['$scope','$filter',function('$scope','$filter'){
,,,,}])
（1）****|currency:'货币符号' 将内容转换为货币格式，默认为美元
(2) **** | filter:子集数组
(3) ****|uppercse, lowercase
(4) ****| orderBy:'表达式‘ 一般用于ng-repeat 且 数据不是简单数据结构
(5) 自定义过滤器：直接用数据模型.filter() 进行定义 app.filter('过滤器名称'，function(){return function（text){ .....}})
app.filter('suffix'，function(){return function(text){ return text.conat('---By -- frank ');}})
E3 时间轴服务
需要在controller中注入，有三种类型【间隔调用服务$interval】【超时服务$timeout】【清除时间轴服务- 无需注入】
app.controller('xxx',['$scope','$interval',‘$timeout',function('$scope','$interval',‘$timeout'){
var timer=null;
timer=$interval (function(){
//$interval.cancel(timer) 取消间隔调用
}，1000);
var timeout=null;
timeout=$timeout(function(){
//$timeout.cancel(timer) 取消延时调用
}，2000);
}]);
E4 监听服务$watch，在使用时不需要在控制器中注入
$scope.$watch('监听变量'， function（）{
}）；
E5 自定义服务 - value 服务
通常服务在注入后才启用内存
.value() 服务是对数据模型的扩展，是在不同控制器之间的全局变量
app.value('自定义服务名称'，json内容）； 相当于$rootScope
E6 自定义服务 - constant 服务
基本与value 类似，申明之后，在controller之外不能更改，之类可以更改
E7 自定义服务 - factory 服务
通过factory（）方法实现创建一个object 对象并直接返回
返回的对象和value 直接提供的对象似乎并没有差别，但是这个对象可以在函数内进行任意操作，
但value无法对其结构进行操作
E8 自定义服务 - service服务
相当于一个class, 并构建了一个空白对象，外部controller中访问只能tongguo访问this元素。
E9 自定义服务 - provider服务
不注入的时候，也驻内存. 所以无论是否注入都进行初始化的，其它和service 同
通过.provider()方法添加，并在第二个函数参数内通过this.$get=function(){...}固定结构扩充
app.provider('providerService',function(){
this.$get=function(){
var obj={};
obj.pname='Frank';
return obj
};
});
F 自定义指令
指令可以理解为属性，自定义指令是一个组件、标签
app.directive('自定义指令名'，function(){ //指令名称必须小写；
return {
restrict:'指令类型'，//'A'-- attribute 属性;'E' --- Element 元素； ’C' -- class； ‘M' -- Comment 以注释方式唤醒；如果是'M' replace 必须写true
template:'指令结构', // html 结构 或 URL
replace:'指令复写' //
};
});