Как использовать угловое обновление 2Adapter.upgradeNg1Component?

Question

Я почти уверен, что у меня нет чего-то фундаментального.

Я начал использовать адаптер обновления ng2 до RC5, чтобы начать портирование приложения ng1 в ng2. И прежде, когда вы объявили директивы, которые компонент использовал непосредственно на компоненте, все правильно подключено и имеет смысл.

Но теперь я пытаюсь перенести свое гибридное приложение в Angular 2 Final, и вся работа NgModule запутывает гибридное приложение, когда дело доходит до зависимостей.

Чтобы создать адаптер обновления, мне нужно передать ему модуль Ng2, который я хочу использовать в гибридном приложении. Хорошо. Но это означает, что модуль Ng2 должен быть полностью определен ПЕРЕД тем, как я создаю адаптер обновления, правильно? Если это так, то как использовать еще не созданный адаптер обновления для обновления компонентов ng1 для использования в модуле ng2 (который необходимо создать до создания адаптера) ???

FYI, в противном случае - у меня есть машинописный модуль, который понижает все компоненты ng2 верхнего уровня, которые мне нужно использовать в ng1 (в конфигурации ui-router), и этот загрузочный модуль загружается после обновления адаптера обновления и модуля Ng2, содержащего мои компоненты для понижения.

Итак, что мне не хватает? Как я могу использовать функциональность upgradeNg1Component адаптера обновления?

Без этой функции это заставляет меня начинать с самых внешних компонентов и работать вовнутрь. И это работает отлично, за исключением того, что есть некоторые общие компоненты, которые используются повсюду, и я предпочел бы не конвертировать их в ng2 в первую очередь.

Answer 1

Я наткнулся на эту же проблему и нашел решение, посмотрев на Angular's source code. Хитрость заключается в том, чтобы использовать forwardRef() при создании UpgradeAdapter:

import {NgModule, forwardRef} from '@angular/core'; 
import {UpgradeAdapter} from '@angular/upgrade'; 

const adapter = new UpgradeAdapter(forwardRef(() => AppModule)); 

@NgModule({ 
    declarations: [ 
     adapter.upgradeNg1Component('my-component'); 
    ] 
}) 
class AppModule { 
} 

// now call adapter.bootstrap()