angularjs1.x.x版本知識點概述

背景：本版本為1.x到2.0版本的過渡版本蕊梧。因為2.0版本幾乎會發(fā)生翻天覆地的變話压固。而且從2.0版本開始，其架構(gòu)方式大大增大了開發(fā)與學(xué)習(xí)的成本秃诵，所以续搀，在該版本中，增加了組件的概念菠净，以方便過渡禁舷。

1、相關(guān)概念:

1). module

在angular中毅往，模塊可以是對象牵咙、方法（如果是數(shù)組，數(shù)組的最后一個元素必須是方法攀唯，前面的元素都是方法按順序排列的參數(shù)名稱）洁桌。后面講的模塊屬性和方法，都屬于通過angular.module()定義的模塊對象侯嘀。如果模塊是方法战坤，是不需要經(jīng)過angular.module()定義的，只需寫入依賴數(shù)組（就是說依賴數(shù)組的元素可以是方法）残拐，模塊在加載依賴關(guān)系的時候直接執(zhí)行了途茫。

注意：通過angular.module()方法定義的模塊是唯一的，如果重復(fù)定義就會覆蓋前面的定義溪食。

2). directive

調(diào)用這個方法表示這個模塊將會注冊一個指令囊卜。directive創(chuàng)建時有一個屬性restrict默認值為"EA"，這里需要注意一下错沃，表示可以通過標簽或者屬性的方式執(zhí)行指令栅组。可選值包括：E(元素), A(屬性), C(類), M(注釋)枢析。

在該版本的angular中玉掸，指令的用途，感覺有點奇怪醒叁，指令不應(yīng)該產(chǎn)生過多的dom節(jié)點司浪，如果產(chǎn)生了泊业，那應(yīng)該用component組件的方式來實現(xiàn)。指令的用途應(yīng)該相對單一啊易，且不會過分的生產(chǎn)出額外的dom節(jié)點吁伺。

3). factory

factory 可以認為是設(shè)計模式中的工廠模式，就是你提供一個方法租谈，該方法返回一個對象的實例篮奄，對于 AngularJS 的 factory 來說，就是先定義一個對象割去，給這個對象添加屬性和方法窟却，然后返回這個對象，例如：

var app = angular.module('MyApp', []);
app.factory('MyFactory', function() {
    // define result object of factory.
    var result = {};
    // add some property and method to the object
    result.greeting = 'Hello from factory.';
    // return the object;
    return result;
});

最后 controller拿到的就是 result 對象呻逆，相當(dāng)于下面的代碼：

var factoryResult = MyFactory();

所謂的factory就是這么簡單夸赫。
注意：factory也可以認為是的單例。

4). service

service 通過 new 運算符進行實例化页慷，可以認為是一個類型憔足，只要把屬性和方法添加到 this 對象上即可，不用顯式返回什么對象酒繁，比如下面的代碼：

app.service('MyService', function() {
    this.greeting = 'Hello from service';
});

controller 拿到的對象就是上面代碼中 this 指向的對象滓彰，相當(dāng)于下面的代碼：

var serviceObj = new MyService();

**注意：** service是以單例的形式注入到組件或者控制器中，也就意味著州袒，在整個生命周期中揭绑，service是共享引用的。在這個組件中做的修改郎哭，會同步到其他所有引用的地方他匪。angular內(nèi)置了N個service服務(wù)，比如：$interval, $location, $timeout

5). provider

與 factory 和 service 稍有不同的是夸研， provider 必須提供一個 ** $get** 方法邦蜜，$ get 方法和 factory要求是一致的，即：先定義一個對象亥至，給這個對象添加屬性和方法悼沈，然后返回這個對象，例如：

app.provider('MyProvider', function() {
    this.$get = function() {
        var result = {};
        result.greeting = 'Hello from provider';
        return result;
    }
})

最后 controller 拿到的對象就是 provider 的 $get 方法返回的對象姐扮，相當(dāng)于下面的代碼：

var instance = new MyProvider();
var provider = instance.$get();

注意： provider是在service基礎(chǔ)上絮供，提供了配置功能，所以provider也是單例模式茶敏。至于怎么配置可以參考如下代碼：

app.config(function(myProviderProvider){
    myProviderProvider.text = "保衛(wèi)干事"
})

5). component

調(diào)用這個方法表示這個模塊將會注冊一個組件壤靶，一個真正意義上的組件，可以跟template中的dom有更多的交互和實現(xiàn)更復(fù)雜的邏輯惊搏。

6). filter

調(diào)用這個方法表示這個模塊將注冊一個過濾器贮乳∮腔唬可以實現(xiàn)字符串的二次轉(zhuǎn)化。（比如：可以將時間格式化）

7). controller

調(diào)用這個方法表示模塊將注冊一個控制器塘揣。在控制器中包雀，你可以編寫代碼宿崭，制作函數(shù)和變量亲铡，并使用 scope 對象來訪問∑隙遥控制器可以直接切入到組件內(nèi)部以方便component組件進行訪問和控制奖蔓。

8). constant

可以注冊一些全局配置變量。（常亮讹堤，不會去改變的吆鹤，值可以為對象，不可以被修改）洲守。
constant注冊的全局變量是可以注入到配置函數(shù)config中疑务。

9). value

可以注冊一些全局參數(shù)。（可以被修改）
value注冊的全局變量是不可以注入到配置函數(shù)config中梗醇。會拋出異常知允。