首頁 > web前端 > js教程 > 主體

AngularJS壓縮JS技巧分析

高洛峰
發布: 2016-12-07 13:57:45
原創
1093 人瀏覽過

本文實例講述了AngularJS壓縮JS的操作技巧。分享給大家供大家參考,具體如下:

大多數web專案在發佈時候都會對js程式碼進行壓縮,目的是為了減少js檔案的大小,節省一點流量。

它的原理很簡單,就是對參數及部分變數名稱和函數進行重新命名。

但是這種工作方式在AngularJS的應用上會有例外。

由於AngularJS的依賴注入是根據參數名稱注入的,顯然,對參數進行重命名會破壞這個機制。

如果不進行特殊處理,進行壓縮(minify)之後,在執行時將會出現這樣的錯誤

Unknow provider: aProvider

對於這種錯誤的官方解釋是:找不到依賴的服務

也就是說這種依賴注入會出現錯誤。

好在AngularJS內建了一種標準機制來處理這個問題.

最簡單也最常見的方式就是用數組代替函數。如:

.controller('RegisterCtrl', ['$scope', '$interval', '$timeout', function ($scope, $interval, $timeout) {
  //do something
}]);
登入後複製

   

數組的最後一個元素總是一個函數,而前面幾個參數都是字串,和這個函數中的參數一一對應。

另一種形式便是所謂的Annotation方式。如

var objCtrl = function($scope, $timeout, $interval){
  // do something
}
//给objCtrl函数增加一个$inject属性,它是一个数组,定义了需要被注入的对象
objCtrl.$inject = ['$scope', '$interval', '$timeout'];
登入後複製

   

這裡的依賴注入形式不僅限於Controller,一切需要DI(依賴注入的directive、factory、services等)都可以採用這兩種方式。


相關標籤:
來源:php.cn
本網站聲明
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn
熱門教學
更多>
最新下載
更多>
網站特效
網站源碼
網站素材
前端模板