我是AngularJS的新手。在我的學習努力中,我依賴於AngularJS教程。現在,我正在嘗試使用AngularSeed項目模板構建一個應用程序。我試圖讓我的項目儘可能模塊化。出於這個原因,我的控制器分成幾個文件。目前,我有以下幾點:在Angular中加載模塊
/app
index.html
login.html
home.html
javascript
app.js
loginCtrl.js
homeCtrl.js
我app.js文件有以下幾點:
'use strict';
var app = angular.module('site', ['ngRoute']);
app.config(function($routeProvider, $locationProvider) {
$locationProvider.html5Mode(true);
$routeProvider.when('/login', {templateUrl: 'app/login.html', controller:'loginCtrl'});
$routeProvider.when('/home', {templateUrl: 'app/home.html', controller:'homeCtrl'});
$routeProvider.otherwise({redirectTo: '/login'});
});
我loginCtrl.js文件當時是非常基本的。它只有:
'use strict';
app.controller('loginCtrl',
function loginCtrl($scope) {
}
);
我的homeCtrl.js幾乎是相同的,除了名稱。它看起來像如下:
'use strict';
app.controller('homeCtrl',
function homeCtrl($scope) {
}
);
我的index.html文件是angularSeed index-async.html文件。然而,當我加載的依賴關係,我有以下幾點:
// load all of the dependencies asynchronously.
$script([
'http://ajax.googleapis.com/ajax/libs/angularjs/1.2.0-rc.3/angular.min.js',
'http://ajax.googleapis.com/ajax/libs/angularjs/1.2.0-rc.3/angular-route.min.js',
'javascript/app.js',
'javascript/loginCtrl.js',
'javascript/homeCtrl.js'
], function() {
// when all is done, execute bootstrap angular application
angular.bootstrap(document, ['site']);
});
我的問題是,有時我的應用程序工作,有時沒有。這幾乎就像什麼東西在別的之前被加載。
有時,我收到這個error。其他時候,我在控制檯窗口中收到一個錯誤信息:loginCtrl.js中顯示'Uncaught ReferenceError:app is not defined'。有時它發生在homeCtrl.js中。
我在做什麼錯?感覺就像我需要在模塊中放置我的控制器,並在app.js文件的app.config中傳遞該模塊。但是,a)我不確定是否允許,b)我不知道如何去做。
看到這個鏈接,可能會幫助你,將'resolve'添加到提供者:http://stackoverflow.com/questions/11972026/delaying-angularjs-route-change-until-model-loaded-to-prevent-flicker –
它似乎正在爲我工作。你使用什麼服務器? login.html的外觀如何? – vinaut