LazyLoading Angular 2选择器

时间:2017-01-24 11:48:50

标签: angular lazy-loading angular2-routing

我正在构建一个有角度的2应用程序。对于一个页面,我有这个手风琴列表。

Accordion1, Accordion2 ...

按预期点击每支手风琴时,会打开包含内容的div。然而,我想要实现的是延迟加载此内容,所以当点击手风琴时,它将我重定向到另一个带有角度2路由器和延迟加载该模块的URL。我到目前为止。 (例如,我被重定向,模块延迟加载)

延迟加载的组件有一个选择器。

这是我手风琴的模板。 “risk-report”是延迟加载的组件, 我当然得到这个错误:

未处理的承诺拒绝:模板解析错误: '风险报告'不是一个已知元素: 1.如果'risk-report'是Angular组件,则验证它是否是该模块的一部分。

是否有任何解决方法,因此我可以重复使用手风琴列表,而不是使用新组件在每个网址上重新声明它。

<div (click)="toggleOpen($event)" [ngClass]="{'accordion-open': isOpen}" class="reportlist accordion-header">
<i class="fa" [ngClass]="{'fa-minus-circle': isOpen, 'fa-plus-circle': !isOpen}"></i><h3>{{report.reportName}}</h3>
<i class='fa fa-check fa-lg green pull-right' *ngIf="isApproved"></i></div>

<div *ngIf="isOpen" style="border-bottom: 1px solid lightgray" [@openClose]="isOpen ? 'open' : 'closed'">

<div style="width: 100%;margin-bottom: 15px" *ngIf="activeReport">
<risk-report (changeReport)="changeReport($event)"></risk-report>
</div>
</div>

编辑:所以我设法解决了这个问题。刚刚将风险报告改为

<router-outlet></router-outlet>

0 个答案:

没有答案