Angular 2 - 获取子组件加载父组件（动态创建）

我想动态创建一个头，构造并将头模板作为'字符串'传递给我的动态组件。我的要求是调用头组件模板字符串中的另一个组件并加载它。Angular 2 - 获取子组件加载父组件（动态创建）

已经创建了一个工作Plunker这里的场景。

我得到一个错误，在浏览器控制台为：

Unhandled Promise rejection: Template parse errors: 
'alert' is not a known element: 
1. If 'alert' is an Angular component, then verify that it is part of this module. 
2. If 'alert' is a Web Component then add "CUSTOM_ELEMENTS_SCHEMA" to the '@NgModule.schemas' of this component to suppress this message. ("  <span class="title" style="float: right; margin-right: 10px;"> 
           [ERROR ->]<alert></alert> 
           <img class="notify-circle" src="https://cdn0.iconf"): [email protected]:32 ; Zone: <root> ; Task: Promise.then ; Value: Object { _nativeError: Error, stack: "" } [email protected]://unpkg.com/@angular/compiler/bundles/compiler.umd.js:1595:29 [angular]

问：

我怎样才能构建为一个字符串的头部模板内公认的“警报”组件，使用选择器'<alert></alert>'。

这个概念可能看起来怪异，但要求是这样的。

来源

2017-01-10 Ranjan

@ yurzui ..感谢..我的要求完美..将帮助我的很多类似的情况。你可以发布你的答案接受。 – Ranjan

您可以创建特殊共享模块包含总是你所需要的

@NgModule({ 
    declarations: [AlertComponent], 
    exports: [AlertComponent] 
}) 
export class SharedDynamicModule {}

，然后将其导入到DynamicModule

dynamic.ts

@NgModule({ 
    imports: [ CommonModule, SharedDynamicModule ], 
    declarations: [ DynamicComponent ] 
}) 
class DynamicHtmlModule { }

Modified Plunker

来源

2017-01-10 09:38:38 yurzui

@ yurzui..just有一个小好奇心，如果未来的要求来动态创建警报组件，共享模块肯定不会在这种情况下工作（只需编辑问题中的重击者并看到）..是否有可能动态创建警报和标题并在布局上呈现它。 – Ranjan

请在重新编辑 – yurzui

上重新创建它，这里是更新后的重新编译的脚本。[链接]（https://plnkr.co/edit/BJEUCyGM0MRdt2EndmqU?p=preview），已删除警报组件并在* header *，但catch没有任何'selector/viewContainerRef'，我们如何在* header *里调用* alert *，这样当头动态加载时，它有* alert *作为其创建的子组件。 – Ranjan

Angular 2 - 获取子组件加载父组件（动态创建）

回答

相关问题