Маршрутизация с контроллерами на этих html-страницах возможна?

Я новичок в разработке AngularJS, и я действительно столкнулся с проблемой. В моем index.html уже есть много таких скриптов:

<script type="text/javascript" src="libs/angular.min.js"></script>
<script type="text/javascript" src="libs/angular-route.js"></script>
<script type="text/javascript" src="libs/angular-translate/angular-translate.js"></script>
<script type="text/javascript" src="libs/angular-translate-loader-partial/angular-translate-loader-partial.min.js"></script>
<script type="text/javascript" src="app/app.js"></script>
<script type="text/javascript" src="app/controllers/commons/language.js"></script>

И чтобы быть более ясным, я хотел бы отделить свои контроллеры приложений от app.js, например:

home.js => HomeCtrl
about.js => AboutCtrl ..

Но, конечно, когда я начал маршрутизацию, у меня была эта ошибка:

Error: [ng:areq] http://errors.angularjs.org/1.2.15/ng/areq?p0=homeCtrl&p1=not%20aNaNunction%2C%20got%20undefined

О моем homeCtrl не существует. Итак, мой вопрос: как я могу указать, что мой контроллер js включен в home.html, а не в index.html во время маршрутизации. Большое спасибо.


person Marc Lamberti    schedule 03.04.2014    source источник


Ответы (1)


Вы можете загрузить свои контроллеры первыми, чем приложение в своем собственном модуле. Ваши модули должны отражать вашу структуру каталогов для удобства.

// app/ctrl/main.js
angular.module('app.ctrl.main' []).controller('mainCtrl', function () {...});

// app/ctrl/about.js
angular.module('app.ctrl.about' []).controller('aboutCtrl', function () {...});

И загрузите свое приложение последним, сделав его зависимым от вышеуказанных модулей:

// app/app.js
angular.module('app', ['app.ctrl.main', 'app.ctrl.about'])
    .config(function ($routeProvider) {
        // route configuration
    });

Ваш html должен выглядеть примерно так:

<script type="text/javascript" src="app/ctrl/main.js"></script>
<script type="text/javascript" src="app/ctrl/about.js"></script>
<script type="text/javascript" src="app/app.js"></script>
person Roger    schedule 03.04.2014
comment
Спасибо за ваш ответ, но проблема в том, что я по-прежнему буду включать много скриптов в мой файл index.html? - person Marc Lamberti; 04.04.2014
comment
Ах, да. Если вас это беспокоит, идите и найдите способы решить эту проблему. Я слышал, что requirejs используется вместе с angular. Вы также можете объединить и минимизировать свои файлы и иметь только один файл (большой, но будет выполнен только один запрос). - person Roger; 04.04.2014