Угловой конфликт JS с JQuery

Question

Я разрабатываю виджет, используя Angular.

У меня есть файл index.html и файл script.js. Из index.html i был включен файл script.js.

scripts.js файл проверяет, что угловое устройство уже загружено или нет. Если Angular не загружен, то последний Angular.min.js (проверенная версия 1.3.14) динамически добавляется к тегу head. И при успехе угловой нагрузки я создал угловой модуль вроде angular.module("widgetApp", []). Это работает нормально.

Но если я включил файл jQuery js (попробовал < 2 и> 2) файл из index.html непосредственно перед script.js, то он вызывает ошибки скриптов из угловой библиотеки.

Это ошибка, которую я получил: Uncaught Error: [$injector:modulerr] http://errors.angularjs.org/1.3.12/$injector/modulerr?p0=myWidgetApp&p1=Err…gleapis.com%2Fajax%2Flibs%2Fangularjs%2F1.3.12%2Fangular.min.js%3A17%3A381).

Я создал plunker для этого вопроса: http://plnkr.co/edit/JHDrGakpuLWpfeauUs1V?p=preview

Любого тела есть идеи по этому вопросу?

Answer 1

Похоже, что проблема заключается в том, что порядок ng-app применяется до создания модуля. Это, вероятно, лучше/надежнее вручную самонастройки вместо добавления ng-app атрибут:

angular.bootstrap(document, ['myWidgetApp']) 

Таким образом, вы можете контролировать, когда бутстраповская происходит, что должно быть после загрузки только все (в scriptLoadHandler)

Вот рабочий plunkr: http://plnkr.co/edit/DKlh5S1ZisxIwluXeJ38?p=preview