У меня было требование, когда я создавал динамический компонент, используя angular5.Я написал директиву, которая генерирует компонент.Он отлично работал в режиме dev / prod.Но при обновлении приложения до angular6 оно работает не так, как в режиме prod, когда AOT включен, класс компилятора недоступен.как я могу изменить дизайн моего soln, чтобы он работал в angular6?
export class HtmlOutletDirective implements OnChanges {
@Input() html: string;
constructor(private vcRef: ViewContainerRef, private compiler: Compiler,
private translate: TranslateService) {
}
ngOnChanges() {
const html = this.html;
if (!html) { return; }
@Component({
selector: 'ccw-dynamic-component',
template: `
<div [innerHtml]="innerHtmlTemplate">
</div>
`
})
class DynamicHtmlComponent {
private innerHtmlTemplate: any = '';
constructor(private httpClient: HttpClient, private sanitizer: DomSanitizer) {
this.httpClient.get(html, { responseType: 'text' }).subscribe((htmlContent) => {
this.innerHtmlTemplate = sanitizer.bypassSecurityTrustHtml(htmlContent.toString());
});
}
}
@NgModule({
imports: [CommonModule],
declarations: [DynamicHtmlComponent]
})
class DynamicHtmlModule { }
this.compiler.compileModuleAndAllComponentsAsync(DynamicHtmlModule)
.then(factory => {
const compFactory = factory.componentFactories.find(x => x.componentType === DynamicHtmlComponent);
const compRef = this.vcRef.createComponent(compFactory, 0);
});
}
Я называю свою директиву следующим образом в моем компоненте:
<mat-accordion [multi]="true">
<mat-expansion-panel *ngFor='let releaseNote of releaseNotes'>
<mat-panel-description>
<dcHtmlOutlet [html]="releaseNote.html"></dcHtmlOutlet>
</mat-panel-description>
</mat-expansion-panel>
</mat-accordion>
Ниже приведена ошибка, которую я получаю:
Runtime compiler is not loaded Error stack trace: Error: Runtime compiler is not loaded at Le (main.00612d315fe86075b5fb.js:1) at t.compileModuleAndAllComponentsAsync