angular之杂类

两种启动方式

1. 使用 ng-app 指令
2.使用angular.bootstrap() 方法来启动。

对于父子controller的访问关系

<div ng-controller="ParentController">
<div ng-controller="ChildController">
</div>
</div>

对于ChildController 的$scope 是可以访问ParentController的$scope的。

对于module提供的method

// 服务
provider(name,providerType)
factory(name,providerFunction)
service(name,constructor)

// 定义变量
value(name,object)
// 常量
constant(name,object)
// 动画
animation(name,animationFactory)
// 过滤器
filter(name,filterFactory)
// 控制器
controller(name,constructor)
// 指令
directive(name,directiveFactory)
// 配置信息
config(configFn)
// 运行的时候调用的初始化方法。
run(initialization)

对于$scope 和 $rootScope 和 $injector 的区别

$injector 是一个IOC容器，包含很多服务 类似spring 的bean

$scope 是javascript 中的作用域，搜索的时候，会优先查找自己的scope，如果没有查找到，会沿着作用域向上搜索，直到根作用域$rootScope

$rootScope是angular加载模块的时候自动创建的，每一个模块只有一个rootscope，rootscope创建好了之后以服务的形式加入到$injector中，rootscope是由angular核心模块ng创建的。

ng-controller 指令会给所在的DOM元素创建一个新的$scope 并为rootscope的子作用域

每个模块只有一个rootscope，但是可以有多个scope

使用angular.element().scope() 返回作用域上，距离该元素最近的scope

value和constant的区别

如果服务的$get方法是返回一个常量，那么就没有必要去定义一个包含复杂功能的完整服务

可以通过value函数去注册服务

而constant是可以被注入的。

通常情况下，使用value来注册服务或者函数，使用constant来配置数据。

父亲和儿子controller之间传递数据

可以在子controller中通过 $emit 来传递数据

父亲controller通过$on 来监听数据

对于父亲controller可以通过$broadcast广播事件

子controller中通过$on来监听数据

对于参数中的event

event.targetScope
event.currentScope
event.name
event.stopPropagation()
event.preventDefault
event.defaultPrevented

service和provider和factory的区别

在angualr中 对于服务service 有
factory
service
provider

另外 angualr 也提供 很多其他内置服务service

$animate

$compile

$document

$timeout

$http

等

另外我们还可以创建自己的service

看下angualr源码中的实现

provider -> factory -> service

function provider(name,provider){
}

function factory(name,factoryFn){
return provider(name:{$get:factoryFfn})
}

function service(name,constructor){
return factory(name,['$injector',function($injector){
return $injector.instantiate(constructor);
}])
}

service 和factory 可以在controller中共享数据。

对于这三者的区别

factory创建的是对象，为他添加属性，然后把这个对象返回出来。

service是使用new 关键字实例化的，因此你应该为this添加属性，

provider是唯一一个可以传递到config函数的service，传递的是，使用xxxProvider 才对。

对于service，是可以被依赖注入到controller中去的。

重点： service作为单例对象对象，在需要创建的时候被创建，只有在应用生命周期结束的时候，才会被清除掉

而controller会在不需要使用的时候被销毁掉。

可以见 hello world 版本的service

对于controller

在切换视图的时候，controller会被重新生成初始化的，所有小心被初始化掉。

关于module

如果在html中使用了空的ng-app 则不需要调用module的run方法

否则 如果 ng-app="test"

angular.module('test').run(function($rootscope){

// 可以注入 rootscope 参数进来。

});

关于angualr方法编写的一些理解

// 依赖注入的东西。
function xxxFilter($local){
// 私有属性
var  xxx = 'private';

// 私有方法。
function test (){
}
// 这边才是真正的参数。
// 暴露给上层的方法。
return function(param){
}
}

对于constant和value的使用区别

相同点：都是定义一个变量。

不同点：

constant一旦初始化了之后，是无法修改的，且可以注入到config方法中去。

value 是不能被注入到config方法中去的，同样也是可以修改的。

对于$compile 服务

function appController($scope,$compile,$document){
$scope.attrs = ['test','baby','sub'];
var htmlTpl = '<h1 ng-repeat="attr in attrs">{{attr}}</h1>';

var $html = $compile(htmlTpl)($scope);

var body = $document.find('body').eq(0);

body.append($html);
}

实现动态编译angular 代码，并在浏览器中渲染出来。

关于controller的依赖注入

var myModel = angular.modul('app',[]);

// 第一种依赖注入
var testController = function(renameScope){
renameScope.title = '我是 title';
}
myModel.controller('testCtrl',testController );

testController.$inject = ['$scope'];

// 第二种依赖注入
myModel.controller('test2Ctrl',['$scope',function($scope){

}]);

对于angular的内置module

'ng' 是angular的内置模块。

对于服务的理解

在ng中，服务的作用是处理模型的持久化。