Приложение AngularJS: как включить файлы .js в index.html

Я новичок в angularJS. Мне удалось создать приложение для телефонной связи, используя angularJS. Приложение в порядке и работает нормально. Проблема в том, что теперь, когда я немного лучше понимаю, как работает angularJS (по крайней мере, я так думаю), я беспокоюсь о структуре файлов моего приложения и ремонтопригодности кода. Мой проект следует шаблону angular-seed. Angular Seed на GitHub, где у меня есть эта структура:

js
   app.js
   controllers.js
   directives.js
   services.js
   filters.js

Изучив, как структурировать приложения с помощью angularJS, я нашел несколько очень хороших статей об этом: Огромные приложения с AngularJS и КАК СТРУКТУРИРОВАТЬ БОЛЬШИЕ ПРИЛОЖЕНИЯ ANGULARJS

Мой вопрос кажется мне очень глупым, но я не мог найти выход. Мне удалось разделить мои контроллеры на разные файлы, и теперь у меня есть такая структура:

scripts
    controllers
             LoginCtrl.js
             HomeCtrl.js
             AboutCtrl.js
             ClientCtrl.js 

Проблема, с которой я борюсь, заключается в том, что в моем приложении раньше был только один файл controller.js. В моем файле index.html я обычно загружаю все файлы сценариев, используя тег сценария. Теперь, когда у меня есть 4 разных файла .js для моих контроллеров, как мне загрузить их в файл index.html? Я должен загрузить их все туда?

Мне кажется неправильным загружать все скрипты в файле index.html таким образом (я знаю, что с одним файлом код будет загружаться одинаково, мне просто странно, что там упаковано много тегов скриптов) . Я нашел проект ng-boilerplate на github, и в их index.html они динамически загружают скрипты. Проблема в том, что я не могу сейчас запустить новый ng-bolierplate, и я не мог найти, как они это сделали. Извините за длинный текст. Спасибо!


person jpgrassi    schedule 17.12.2013    source источник
comment
возможный дубликат соглашения AngularJS для нескольких файлов   -  person Stewie    schedule 17.12.2013
comment
Я никогда раньше не использовал хрюканье. В моем проекте он не установлен, и я являюсь проектом телефонной связи, поэтому я действительно не понимаю, как это сделать.   -  person jpgrassi    schedule 17.12.2013


Ответы (2)


Ссылка на каждый файл скрипта в его собственном теге в index.html — определенно один из способов сделать это, и самый простой. Однако, если вы хотите что-то более чистое, взгляните на одно из различных руководств по объединению Angular с RequireJS:

http://www.startersquad.com/blog/angularjs-requirejs/

Имеет ли смысл использовать Require.js с Angular.js?

Этот подход направлен в первую очередь на решение проблемы того, в каком порядке загружать файлы, чтобы удовлетворить зависимости, но он также приводит к очистке index.html... хотя и за счет дополнительной настройки в другом месте.

person S McCrohan    schedule 17.12.2013
comment
Спасибо, Первая статья помогла мне понять, как это работает. Я подумаю об его использовании, потому что наш проект запущен и работает, и я не хочу вносить серьезные изменения прямо сейчас. - person jpgrassi; 17.12.2013

Используйте http://browserify.org/.

Вы получаете очень простые и элегантные общие модули и множество замечательных библиотек из node.js в своем браузере.

Код собирается в один файл js.

person Sava Jcript    schedule 24.07.2015