Блог

Главная - Вопросы по программированию - «Неперехваченный объект» при добавлении AngularJS в приложение для бранча

«Неперехваченный объект» при добавлении AngularJS в приложение для бранча

#angularjs #brunch

#angularjs #бранч

Вопрос:

Предисловие: поскольку я новичок как в AngularJS, так и в Бранче, я хочу изучить основы, а также создать и применить с нуля (т. Е. Из dead-simple скелета бранча). Я хорошо знаю, что существуют скелеты, которые специально предназначены для начальной загрузки приложения AngularJS / Brunch, и я изучал их код, чтобы выяснить, что «заставляет их работать». Но, будучи новичком, я не вижу решения своей проблемы…

Проблема: пока я добавляю ng-app (без какого-либо значения) к html элементу, AngularJS работает просто отлично. Но как только я добавляю значение (т.Е. ng-app="MyApp" ) К этому атрибуту, AngularJS перестает работать. Консоль в Chrome сообщает мне, что она обнаружила «Неперехваченный объект» в строке 1695 angular.js .

Похоже, что javascript, добавленный Brunch, вызывает это: если я удалю код на самом верху, сгенерированный Brunch в app.js файл общей папки, опять же, это работает. Но очевидно, что это не может быть решением моей проблемы.

Вот код моего app/assets/index.html :

 <html ng-app="myApp">
    <head>
        <title>Test</title>
    </head>
    <body>
        <script src="app.js"></script>
    </body>
</html>

Это код в моем app/app.coffee (который объединен с кодом Brunch и AngularJS в результирующем public/app.js ):

 angular.module("myApp", [])

Вопрос: чего мне не хватает? Я вижу, что в конкретных скелетах index.html файл содержит a <script>require('MyApp')</script> , но его добавление не решает проблему.

Любой намек для новичка, такого как я, очень ценится. Спасибо!

Комментарии:

1.Спасибо за подсказку. На самом деле, это была опечатка в моих фрагментах, и она есть ng-app="myApp" (одинаковая как в файлах html, так и в файлах coffee). Я исправил это в своем вопросе.

Ответ №1:

Хорошо, я наконец понял это. Действительно, должен быть дополнительный <script>require('app');</script> фрагмент. Однако убедитесь, что параметр для этого require() вызова соответствует имени файла, в котором создается ваше приложение Angular.

Пример:

  • Ваш HTML-тег использует ng-app="myAwesomeApp" . Соответствующий код Javascript должен ссылаться на это angular.module("myAwesomeApp", []) .
  • Если ваш файл Javascript (в котором создается модуль Angular) просто вызывается app.js , то соответствующий <script>require('app');</script> должен отражать это. Если вы также решите назвать свой файл myAwesomeApp.js Javascript, сопоставьте его с <script>require('myAwesomeApp');</script> .
Метки: