1、 Module使用方法
var APP =angular.module(‘fontApp‘,[‘ngResource‘, ‘ngRoute‘, ‘ngSanitize‘]);
APP为定义的别名，之后的调用都应尽量使用该别名
‘fontApp‘ ng-app="fontApp"
新版本angular中route被分离出来，各个被使用的Providerdou需要在此处声明。
大型应用应该拆分模块来做，先定义一个服务模块，然后再加载它
angular.module(‘xmpl.service‘,[])
angular.module(‘xmpl‘, [‘xmpl.service‘])
用以下代码可以实现双向绑定，功能等同于ng-app
angular.element(document).ready(function() {
angular.bootstrap(angular.element(document.getElementById("rootOfApp")));
});
2、 angular全局定义的三种方式
- 用var定义global全局变量，JS方法，优先级最高
- .constant，定义常量，不能被修改
- .value，定义静态变量，不能运算，但是可以通过extend修改
此外，还可以通过factory功能来定义变量。
我用以下方式对数据进行了存放：
.constant(‘global‘,{
version: "0.1",
DataUrl: {
testUrl: DataWeb + "index.asp"
}
});
存放中的DataWeb是用var定义的全局变量，因为在constant中没能平级调用成功。
调用时使用了
.service(‘JsonSource‘, [‘$resource‘,‘global‘,
function($resource,global) {
return $resource(global.DataUrl.testUrl, {}, { }});
}])
需要调用多个参数时只需要声明一次‘global‘，缺点是定义部分不够清晰，如果之后重构时优势不够明显，可能会把constant里的内容拆分出来一些。
3、 Service就是【单例对象】在AngluarJS 中的一个别名，保证你每次访问到的都是同一个实例，service总是一个单体，无论是哪种类型的service。
Service包含5类，constant、value、factory、service、provider。
定义service有2种方式
myModule.factory(‘serviceId’,function() {});
或
angular.module(‘myModule’,[],function($provide) {
$provide.factory(‘serviceId’,function() {})
})
factory会直接实例化
service会延迟实例化，被依赖或请求之后才实例化
Provider是factory的加强,一个provider中应当由一个$get函数,注入一个控制器时，我们实际上注入的是$get函数。我们可以在config阶段配置一个provider。
$provide是Angular用来创建service的接口，$provide有一个函数，decorator，也用来装饰service，在回调函数中接收一个$delegate来代表我们实际上的service实例。
4、 声明依赖
使用array notation
function myModuleCfgFn ($provide) {
$provide.factory(‘myService’,[‘dep1’,’dep2’,function(dep1,dep2){}]);
}
使用$inject属性
function myModuleCfgFn($provide) {
var myServiceFactory = function(dep1, dep2) {};
myServiceFactory.$inject = [‘dep1‘, ‘dep2‘];
$provide.factory(‘myService‘, myServiceFactory);
}
使用隐式DI（不兼容压缩混淆的代码）
function myModuleCfgFn($provide) {
$provide.factory(‘myService‘, function(dep1, dep2) {});
}
对所使用的service类,都需要声明依赖，隐式DI是实验属性，尽量不要使用。
调用时的参数名可以随意，但顺序要和声明保持一致。
5、 template
Directive - 一个扩展现有DOM元素或者代表一个可复用的DOM组件的属性或者元素，即控件。
Directive有驼峰式（camel cased）的风格的命名。但directive也可以支蛇底式的命名（snake case）
compiler通过$interpolate服务匹配文本与属性中的嵌入表达式（如{{something}}）。这些表达式将会注册为watches
compile function用于处理DOM模版的转换。一般是那种需要转换DOM模版的（如ngRepeat），或者是需要异步加载内容的（如ngView）。compile function 可以有一个返回值，类型可以是function或者object。
link function负责注册DOM事件监听器，也可以进行DOM的更新操作。link function会在模版克隆操作完毕之后执行。这里存放着directive大多数的逻辑。
attribute object - 在link()或compile()中作为参数
Markup - 通过双大括号表示法{{}}来绑定表达式到元素中，是内建的angular标记。
Filter - 用于格式化我们给用户看的数据。
Form controls - 让我们验证用户输入。
双向数据绑定的关键directive是ngModel。
6、 Scope
scope是一个指向应用model的object。它也是expression的执行上下文。scope被放置于一个类似应用的DOM结构的层次结构中。scope可以监测（watch,$watch）expression和传播事件。
每一个angular应用有且只有一个root scope，但可以拥有多个child scope。
当angular对{{username}}求值时，它首先查看与当前元素关联的scope的username属性。如果没有找到对应的属性，它将会一直向上搜索parent scope，直到到达root scope。在javascript中，这个行为被称为“原型继承”，child scope典型地继承自它们的parent。
在debugger中查看scope：在console中输入：angular.element($0).scope()
当浏览器在angular执行环境外调用javascript代码时，这意味着angular是不知道model的改变的。要正确处理model的修改，这个命令必须通过使$apply方法进入angular执行环境。
7、 Controller
在angular中，controller是一个javascript 函数（type/class），被用作扩展除了root scope在外的angular scope的实例。
angular将一个新的scope对象应用到controller构造函数（估计是作为参数传进去的意思），建立了初始的scope状态。这意味着angular从不创建controller类型实例（即不对controller的构造函数使用new操作符）。构造函数一直都应用于存在的scope对象。
controller不应该尝试做太多的事情。它应该仅仅包含单个视图所需要的业务逻辑（还有点没转过弯了，一直认为Controller就是个做转发的……）。
保持Controller的简单性，常见办法是抽出那些不属于controller的工作到service中，在controller通过依赖注入来使用这些service。
ng-controller完成了一下功能
var injector = angular.injector([‘OtherModule‘,‘ng‘]);
injector.instantiate(MyController);
8、 Internet Explorer Compatibility
为了让我们的angular应用在IE上工作，请确保：
按需引入JSON.stringify（IE7或以下的都需要这玩意）。我们可以使用JSON2（https://github.com/douglascrockford/JSON-js）或者JSON3（http://bestiejs.github.com/json3/）。
不要使用自定义标签，诸如<ng:view>（用属性版代替，如<div ng-view>）。如果还是想使用，则请看第3点。
如果你确实想使用自定义标签，那么你必须做以下步骤，让老IE认识你的自定义标签。
<!--[if lte IE 8]>
<script>
document.createElement(‘ng-include‘);
document.createElement(‘ng-pluralize‘);
document.createElement(‘ng-view‘);
// Optionally these for CSS
document.createElement(‘ng:include‘);
document.createElement(‘ng:pluralize‘);
document.createElement(‘ng:view‘);
</script>
<![endif]-->
9、 $location服务
$location服务分析浏览器地址栏中的URL（基于window.location），让我们可以在应用中较为方便地使用URL里面的东东。在地址栏中更改URL，会响应到$location服务中，而在$location中修改URL，也会响应到地址栏中。
$location 服务为只读的URL部分（absUrl，protocol，host，port）提供getter方法，也提供url，path，search，hash的getter、setter方法。
所有setter方法都返回同一个$location对象，以实现链式语法。
如果我们想让我们的Ajax应用能够被索引，我们需要在head中增加一个特殊的meta标签：<meta name="fragment" content="!" />
$location服务仅仅允许我们改变URl；它不允许我们重新加载页面（reload the page）。当我们需要改变URL且reload page或者跳转到其他页面时，我们需要使用低级点得API，$window.location.href。
$location知道angular的scope life-cycle。当浏览器的URL发生改变时，它会更新$location，并且调用$apply，所以所有$watcher和$observer都会得到通知。
angular compiler当前不支持方法的双向绑定。如果我们希望对$location对象实现双向绑定（在input中使用ngModel directive），我们需要指定一个额外的model属性（例如：locationPath），并加入两个$watch，监听两个方向上的$location更新，例如：
<input type="text" ng-model="locationPath" />
// js - controller
$scope.$watch(‘locationPath‘, function(path) {
$location.path(path);
);
$scope.$watch(‘$location.path()‘, function(path) {
scope.locationPath = path;
});
angularjs 学习笔记 -----结构定义