如何解决找不到NgbNav的包装器 Angular,ng-bootstrap和Bootstrap的版本:
我能够将NgbTabSet从一个控制器传递到另一个控制器,将其封装在ng-template标记内并为该ng-template分配ID。但这对于NgbNav似乎是不可能的,因为如果我将其封闭在ng-template中,我将无法将NgbNav捕获为@ViewChild。
这就是NgbTabSet的样子:-
<ng-template #caseContent>
<ngb-tabset #t="ngbTabset" type="pills" (tabChange)="changeTab($event)">
<ngb-tab id="caseDetailsTab" title="Case Details" translate>
<ng-template ngbTabContent>
<app-case-details [unknownItemsCount]="unknownItemsCount" (viewAdditionalCase)="generateNewCaseTab($event)" [caseId]="caseId" [permissionList]="permissionList" (isQuarantined)="isQuarantined = $event" (isReviewed)="isReviewed = $event" (noteCountUpdate)="noteCount = $event"></app-case-details>
</ng-template>
</ngb-tab>
</ng-template>
以下是相应的component.ts:-
@ViewChild('caseContent') caseContentTemplate: any;
@ViewChild(NgbTabset) set content(content: NgbTabset) {
this.tabSet = content;
}
如果要使用activeId或其他东西,这里this.tabSet可以让我访问选项卡,但是我可以简单地将“ caseContentTemplate”传递给另一个我实际上想显示选项卡的组件。
但是,到目前为止,这是我的NgbNav:-
<ul ngbNav #nav="ngbNav" class="nav-tabs" (navChange)="changeTab($event)">
<li ngbNavItem="caseDetailsTab">
<a ngbNavLink i18n>Case Details</a>
<ng-template ngbNavContent>
<app-case-details [unknownItemsCount]="unknownItemsCount" (viewAdditionalCase)="generateNewCaseTab($event)"
[caseId]="caseId" [permissionList]="permissionList" (isQuarantined)="isQuarantined = $event"
(isReviewed)="isReviewed = $event" (noteCountUpdate)="noteCount = $event"></app-case-details>
</ng-template>
</li>
</ul>
在component.ts中:-
@ViewChild('nav',{ static: true}) set content(content: NgbNav) {
this.tabSet = content;
}
然后我将“ this.tabSet”传递给其他组件(因为将其封装在里面将无法工作),但是不知何故它不带NgbNavItem,而只是将NgbNavContent呈现在目标组件的html页面上。
是否有一种解决方法可以包含整个NgbNav并将其传递给另一个控制器?预先感谢。
Angular,ng-bootstrap和Bootstrap的版本:
角度:9.1.12
ng-bootstrap:5.6.1
@ ng-bootstrap / ng-bootstrap:6.2.0
引导程序:4.5.1
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。