2016-06-17 3 views
2

У меня есть приложение Angular1, загруженное внутри компонента Angular2.Как сказать Angular2 игнорировать встроенное приложение Angular1?

Шаблон:

<div #ng1Hook></div> 
<input type="text" ng-model="vm.filters.date" /> 

Компонент:

@ViewChild('ng1Hook') div; 
ngAfterViewInit() { 
    angular.bootstrap(this.div.nativeElement, ['ng1Module']); 
} 

Проблема заключается в том, что NG2 пытается разобрать код NG1 внутри его шаблона. Например, в дальнейшем по шаблону есть такой код: ng-model="vm.filters.date" и, конечно же, NG2 не может справиться с этим.

Сейчас мой NG2 компонент жалуется, что не может прочитать свойство 'xyz' неопределенного что-то я использую в шаблоне NG1 компонента ng-model=vm.xyz

Как я могу тела NG2 игнорировать код NG1 внутри его шаблона ? Или существуют другие способы правильного встраивания NG1 внутри NG2?

+0

Angular2 не пытался обрабатывать 'ng-model =" vm.filters.date "'. Не могли бы вы предоставить более подробную информацию о том, в чем проблема? –

+0

На самом деле я сомневаюсь, что это вызвано 'ng-model = vm.xyz'. Этот фрагмент не содержит ничего, что могло бы заставить Angular2 обрабатывать его. Я скорее думаю, что у вас есть что-то вроде '{{vm.xyz}}' в вашем HTML, который будет обрабатываться Angular2. –

+0

Возможно, я неправильно реализую ng1 внутри ng2, в основном у меня есть полный модуль ng1 внутри компонента ng2, который, возможно, не сможет работать вообще. Я получаю журналы из модуля ng1, хотя, так что он жив. Я просто ищу подходящее место для размещения модуля ng1 html – RobSeg

ответ

2

Вы можете добавить атрибут ngNonBindable, чтобы предотвратить работу Angular2 с привязками или создавать рецепты или компоненты.

Если HTML добавляется динамически Angular2 также не будет обрабатывать его

<div [innerHTML]="someHtml"> 

Содержание someHtml будет добавлен в DOM и не обрабатываются Angular2 каким-либо образом.

+1

ngNonBindable сделал трюк – RobSeg

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