2014-11-03 139 views
0

我使用requirejs加載角度和角度模塊。角度初始化後加載角度模塊

我想要所有必要的模塊(例如angular-sanitize.js)在一起。

在我require.config我定義以下規則:

require.config({ 
    path: { 
     'angular':'libs/angular-modules' 
    }, 
    shim: { 
     'angular': { 
      deps: ['libs/angular'], 
      exports: 'angular' 
     }, 
     ... 
    } 
}); 

而且在庫/角modules.js我定義如下模塊:

define(
    [ 
     'libs/angular-sanitize', 
     'libs/angular-animate' 
    ], 
    function() { 
     return angular; 
    } 
); 

我希望在加載模塊的時間angular.js將被加載。但有時我得到錯誤:

Cannot read property '$$minErr' of undefined angular-sanitize.js:8

這是角sanitize.js的第八行:

var $sanitizeMinErr = angular.$$minErr('$sanitize'); 

所以這意味着angular.js文件不是加載,但在網絡標籤我看到它。 我想在初始化時角衛生模塊angular.js已加載,但尚未初始化(window.angular尚未定義)。

我如何確定角度已被初始化?

回答

-1

AngularJs不支持延遲加載......但。

有幾件事情流傳在互聯網上,理應允許延遲加載,但在我看來,他們是凌亂和過於臃腫的益處很小爲此

+0

所以我想我產生了幻覺,當我的應用程序,它使用RequireJS需求是加載AngularJS * *完美運行**,對吧? – Louis 2014-11-03 11:01:54

+0

所以@Louisll也許你知道如何防止這個錯誤? – Goodnickoff 2014-11-03 11:06:06

+0

你正在使用requireJS加載角度項目的依賴關係?或將新控制器等加載到現有模塊? – DrogoNevets 2014-11-03 11:08:59

0

requireJS不會與角工作希望看到的angular-sanitize墊片在RequireJS配置:

shim: { 
    ... [whatever you already have] , 

    'angular-sanitize': { 
     deps: ['angular'], 
    }, 
} 

我沒有把一個exports的選擇,因爲我不能確定什麼是有意義那裏。對於AngularJS模塊,我不希望需要對於exports

一般的經驗法則是,如果你打開圖書館的來源,並找不到自己調用define,那麼它需要一個墊片。 angular-animate可能也需要一個墊片。

+0

這很奇怪,但你的例子似乎工作。但我不明白爲什麼。在我的代碼中,我還爲_angular-modules.js_文件(加載_angular-sanitize_模塊的文件)指定了依賴項('deps:['libs/angular']')。 – Goodnickoff 2014-11-03 12:52:15

+0

如果錯誤沒有出現,我將您的答案標記爲「正確」。 – Goodnickoff 2014-11-03 12:54:08

0

您可以在路由配置解析中延遲加載您的依賴關係。返回一個承諾,並使用需要先裝入這些依賴關係,然後解析承諾:

.when('/login', { 
 
    templateUrl: appConfig.getUrl('login'), 
 
    resolve: { load: ['$q', '$rootScope', '$log', function ($q, $rootScope, $log) { 
 
     var deferred = $q.defer(); 
 
     require(appConfig.getDeps('login'), function() { 
 
     $rootScope.$apply(function() { 
 
      forms.hideError(); 
 
      deferred.resolve(); 
 
     }); 
 
     }); 
 
     return deferred.promise; 
 
     }] 
 
    } 
 
    })