Используйте модуль AngularJS (Angular1) от проекта Angular2

Только что начал демонстрационный проект Angular2 (без предварительного опыта с Angular1/AngularJS. Последовал и расширялся из онлайн-стартов и учебных пособий, и все было в порядке. где я хотел бы использовать некоторые компоненты из библиотеки, которая предназначена для AngularJS, и не имеет никаких проблем!Используйте модуль AngularJS (Angular1) от проекта Angular2

Большая часть информации о совместимости с AngularJS/Angular2 предполагает, что у вас есть проект AngularJS, который вы добавляете Компоненты Angular2 - не наоборот - поэтому то, что я надеюсь сделать, возможно, даже не возможно. То, что я пробовал до сих пор, включает в себя простой проект с разборкой, основанный на ускоренном запуске Angular2, с одним компонентом Angular2, который загружает в index.html. Мне бы хотелось, чтобы я ntegrate из существующей библиотеки (на основе AngularJS).

Я попытался с помощью UpgradeAdapter.upgradeNg1Component для создания компонентов из библиотеки и добавить их непосредственно в мой компонент Angular2
Я попытался установить angularjs через НПМ, импортировать его в тег сценария в мой index.html а затем, используя комбинацию UpgradeAdapter.downgradeNg2Component и UpgradeAdapter.bootstrap, чтобы загрузить мой Angular2 как понизили модуль

Ни один из них, кажется, работают - компонент не может т o показать, и консоль браузера сообщает мне, что у меня есть Uncaught SyntaxError: Unexpected token < Evaluating http://localhost:3000/angular2/upgrade Error loading http://localhost:3000/app/main.js

Мое лучшее предположение в настоящий момент заключается в том, что на самом деле это неподдерживаемый сценарий, и мне нужно иметь «правильное» приложение AngularJS, чтобы использовать UpgradeAdapter Функциональность от Angular2. Может ли кто-нибудь подтвердить это? Или что-то глупое мне здесь не хватает?

источник

2016-02-06 Michael

@Bryan Спасибо за это - я понял, что для гибридного приложения AngularJS/Angular2 вы не используете тег 'ng-app' и должны использовать' bootstrap() '? – Michael

Таким образом, основная проблема в этом случае оказалась фактом, что, как представляется, компоненты обновления не включены как часть o f - основной угловой 2 пучок. После добавления:

<script src="node_modules/angular2/bundles/upgrade.min.js"></script>

в мой файл index.html погрешность я видел исчез.

Благодаря ответу here для указания меня в правильном направлении!

источник

2016-02-06 10:54:41 Michael

Связывание непосредственно с вашей папкой node_modules является плохим решением. После развертывания вашего решения эта папка больше не существует (при условии, что вы используете какую-то настройку комплектации) –

Вот рабочий plunkr, описывающий, как смешивать Angular1 и Angular2 элементы:

http://plnkr.co/edit/yMjghOFhFWuY8G1fVIEg?p=preview

Важным моментом является bootstrap основного компонента на UpgradeAdapter. Таким образом, все элементы доступны в поставщиков (услуги/заводов) и в директивах (компоненты/директивы):

upgrade.bootstrap(document.body, ['heroApp']);

Эти два ответа может помочь вам:

источник

2016-02-06 06:32:55

Используйте модуль AngularJS (Angular1) от проекта Angular2

ответ

Смежные вопросы