MeanJS - интегрировать Angular в файл index.html

У меня опыт работы с LAMP, и в качестве учебного проекта я скачал MEAN.JS, чтобы погрузиться в стек MEAN. . У меня все работает, но я чувствую, что что-то упускаю...

Я выполнил все шаги на http://meanjs.org/generator.html, запустил Mongo, мой сервер работает и т. д. Мой файл index.html загружается на localhost: 3000, и жизнь прекрасна.

Итак, я мысленно просматриваю контрольный список...

MongoDB — проверка (запускается после выполнения mongod.exe).

Node - Check (сервер запущен после выполнения grunt).

Экспресс-чек (привязан к Node как к серверу).

Угловой - ....??

Я вижу, что установка MEAN.JS установила несколько папок для Angular, но я не думаю, что мой файл index.html волшебным образом «работает» для Angular. На самом деле, чтобы заставить Angular работать, мне пришлось сделать это старым добрым способом в моем элементе головы:

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.0.7/angular.min.js"></script>

Так что же на самом деле здесь делает MEAN.JS? И как мне интегрировать Angular, если не так? Я был бы признателен за любую помощь в этом.

Спасибо!


node.js javascript angularjs mean-stack meanjs
person aikorei    schedule 16.08.2014    source источник
comment
angular.js должен автоматически включаться механизмом шаблонов Express.   -  person runTarm    schedule 16.08.2014
comment
@runTarm это, вероятно, было, но как это отображается в моем файле index.html? Как мне подключить Angular, чтобы я мог использовать его функции? Что-то я не понимаю.   -  person aikorei    schedule 16.08.2014
comment
Вы говорите, что angular.js действительно отсутствует на странице по умолчанию новой установки meanjs? Он должен быть включен по умолчанию, иначе может быть что-то не так.   -  person runTarm    schedule 17.08.2014
comment
@aikorei запускается вручную в терминале bower install после npm install. Это работа, я проверял.   -  person khex    schedule 19.08.2014

Ответы (3)


arrow_upward
1
arrow_downward

Лучшие практики Angular — загружать скрипты не в HEAD, а в конец документа, перед тегом. Прокрутите до конца вашего HTML-файла, возможно, он здесь.

    !-- Application JavaScript Files -->
    <script src="lib/angular/angular.js" type="text/javascript"></script>
    <script src="lib/angular-resource/angular-resource.js" type="text/javascript"></script>
    <script src="lib/angular-animate/angular-animate.js" type="text/javascript"></script>
    <script src="lib/angular-ui-router/release/angular-ui-router.js" type="text/javascript"></script>
    <script src="lib/angular-ui-utils/ui-utils.js" type="text/javascript"></script>
    <script src="lib/angular-bootstrap/ui-bootstrap-tpls.js" type="text/javascript"></script>
    <script src="config.js" type="text/javascript"></script>
    <script src="application.js" type="text/javascript"></script>
    .................//..............................
    <script src="modules/users/controllers/settings.client.controller.js" type="text/javascript"></script>
    <script src="modules/users/services/authentication.client.service.js" type="text/javascript"></script>
    <script src="modules/users/services/users.client.service.js" type="text/javascript"></script>
    <!-- Livereload script rendered -->
    <script src="http://localhost:35729/livereload.js" type="text/javascript"></script>
</body>

If <script src="lib/angular/angular.js"... is not here check meanJsFolder/public/lib for the presence of these libraries

\angular
\angular-animate
\angular-bootstrap
.......
\bootstrap
\jquery

Если папка lib пуста - что-то происходит с Bower - менеджером пакетов для интерфейса. Он устанавливает все библиотеки angular.

person khex    schedule 17.08.2014
comment
Все это было в моей папке. Оказывается, на мой вопрос ответил этот пост SO: stackoverflow.com/questions/23398485/ - person aikorei; 18.08.2014

arrow_upward
0
arrow_downward

Оказывается, на мой вопрос ответили здесь:

Uncaught ReferenceError: angular не определен - Mean.IO

Короче говоря, я открыл /public/lib/bootstrap/ и нашел свой файл bower.json. Я добавил в строки, отмеченные в приведенной выше ссылке, т.е.:

  {
  "name": "mean",
  "version": "0.3.0",
  "dependencies": {
    "angular": "latest",
    "angular-resource": "latest",
    "angular-cookies": "latest",
    "angular-mocks": "latest",
    "angular-route": "latest",
    "bootstrap": "latest",
    "angular-bootstrap": "0.10.0",
    "angular-ui-router": "#master"
  }

Затем запустил обновление Bower, и моя страница загрузилась.

person aikorei    schedule 18.08.2014

arrow_upward
0
arrow_downward

Введите «bower install» в CLI. Это установит библиотеку angular и поместит ее в указанный каталог.

person user3681587    schedule 30.12.2014