Я хочу показать диалог с angular2, как показано в этом примере: https://getmdl.io/components/index.html#dialog-section
Поэтому здесь я использую полифил диалога: https://github.com/GoogleChrome/dialog-polyfill
Этому полифиллу нужен диалоговый элемент прямо под телом. Для этого я создал компонент-оболочку, который прикреплен к самому тегу диалога. Этот компонент следует использовать только один раз в приложении.
Пример кода компонента (см. все в plnkr ниже):
let factory: ComponentFactory<any> = this.componentFactoryResolver.resolveComponentFactory(type);
let injector = this.viewContainerRef.injector;
this.componentRef = this.viewContainerRef.createComponent(factory, 0, injector);
let dialogElement = this.el.nativeElement;
if (!dialogElement.showModal) {
dialogPolyfill.registerDialog(dialogElement);
}
this.renderer.invokeElementMethod(dialogElement, 'showModal');
Я использую службу с наблюдаемыми, чтобы позволить другим компонентам передавать компоненты для отображения в диалоговом окне.
Как вы можете видеть в плункере, содержимое отображается не в диалоговом окне, а прямо под тегом диалогового окна.
Какую часть мне здесь не хватает?
Что мне нужно сделать, чтобы передать аргументы вызываемому компоненту? например когда я хочу попросить пользователя удалить объект, мне нужно знать идентификатор этого объекта.
