關於angularjs的一些小知識點

指令（directive）。

　　　　指令能夠用來建立自定義的標籤。它們能夠用來裝飾元素或者操做DOM屬性。能夠做爲標籤、屬性、註釋和類名使用。

這裏是一個例子，它監聽一個事件而且針對的更新它的$scope ，以下：

　　

　　而後，你可使用這個自定義的directive來使用：

　　<my-component ng-model="message"></my-component>

     使用一系列的組件來建立你本身的應用將會讓你更方便的添加，刪除和更新功能。

     對於AngularJS的特性的介紹，接下來，介紹一下它的功能。主要講一下ng的內置過濾器的一些內容。

   　　　  1.currency (貨幣處理)

                 使用currency能夠將數字格式化爲貨幣，默認是美圓符號，你能夠本身傳入所需的符號，例如我傳入人民幣：

         　　{{num | currency : '￥'}}

　　　　

　　　date(日期格式化)

                   原生的js對日期的格式化能力有限，ng提供的date過濾器基本能夠知足通常的格式化要求。用法以下：

　　　　{{date | date : 'yyyy-MM-dd hh:mm:ss EEEE'}}　　

　　　　參數用來指定所要的格式，y M d h m s E 分別表示年月日時分秒星期，你能夠自由組合它們。也可使用不一樣的個數來限制格式化的位數。另外參數也可使用特定的描述性字符串，例如「shortTime」將會把時間格式爲12:05 pm這樣的。ng提供了八種描　　　　　　　　　　述性的字符串，我的以爲這些有點多餘，我徹底能夠根據本身的意願組合出想要的格式，不肯意去記這麼多單詞~

　　filter（匹配子串）

             這個名叫filter的filter。用來處理一個數組，而後能夠過濾出含有某個子串的元素，做爲一個子數組來返回。能夠是字符串數組，也能夠是對象數組。若是是對象數組，能夠匹配屬性的值。它接收一個參數，用來定義子串的匹配規則。下面舉個例子說明一下參數的用法，我用如今特別火的幾個孩子定義了一個數組：

　　$scope.childrenArray = [

        　　{name:'kimi',age:3},

        　　{name:'cindy',age:4},

        　　{name:'anglar',age:4},

        　　{name:'shitou',age:6},

        　　{name:'tiantian',age:5}

　　];

　　$scope.func = function(e){return e.age>4;}{{ childrenArray | filter : 'a' }} //匹配屬性值中含有a的

　　{{ childrenArray | filter : 4 }}  //匹配屬性值中含有4的

　　{{ childrenArray | filter : {name : 'i'} }} //參數是對象，匹配name屬性中含有i的

　　{{childrenArray | filter : func }}  //參數是函數，指定返回age>4的。

     json(格式化json對象)

           json過濾器能夠把一個js對象格式化爲json字符串，沒有參數。這東西有什麼用呢，我通常也不會在頁面上輸出一個json串啊，官網說它能夠用來進行調試，嗯，是個不錯的選擇。或者，也能夠用在js中使用，做用就和咱們熟悉的JSON.stringify()同樣。用法超級簡單：

　　　　{{ jsonTest | json}}。

     5.limitTo(限制數組長度或字符串長度)

           limitTo過濾器用來截取數組或字符串，接收一個參數用來指定截取的長度，若是參數是負值，則從數組尾部開始截取。我的以爲這個filter有點雞肋，首先只能從數組或字符串的開頭/尾部進行截取，其次，js原生的函數就能夠代替它了，看看怎麼用吧：

{{ childrenArray | limitTo : 2 }}  //將會顯示數組中的前兩項。

     lowercase(小寫)

           把數據轉化爲所有小寫。沒有參數，只能把整個字符串變爲小寫，不能指定字母。

    uppercase(大寫)

             同上。

    number(格式化數字)

            number過濾器能夠爲一個數字加上千位分割，像這樣，123,456,789。同時接收一個參數，能夠指定float類型保留幾位小數：

{{ num | number : 2 }}。

    orderBy(排序)

            orderBy過濾器能夠將一個數組中的元素進行排序，接收一個參數來指定排序規則，參數能夠是一個字符串，表示以該屬性名稱進行排序。能夠是一個函數，定義排序屬性。還能夠是一個數組，表示依次按數組中的屬性值進行排序（若按第一項比較的值相等，再按第二項比較），仍是拿上面的孩子數組舉例：

　　　　<div>{{ childrenArray | orderBy : 'age' }}</div>      //按age屬性值進行排序，如果-age，則倒序

　　　　<div>{{ childrenArray | orderBy : orderFunc }}</div>   //按照函數的返回值進行排序

　　　　<div>{{ childrenArray | orderBy : ['age','name'] }}</div>  //若是age相同，按照name進行排序

　　　　正如你所看到的，ng內置的過濾器也並非萬能的，事實上好多都比較雞肋。更個性化的需求就須要咱們來定義本身的過濾器了，下面來看看如何自定義過濾器。