Question

我尝试使用NgTabset但是我收到此错误 TypeError：无法读取属性＆＃39; templateRef＆＃39;未定义的。当我用模板标签替换 ng-template 时，一切正常。我做错了什么？这是代码：

<ngb-tabset>
  <ngb-tab>
    <ng-template ngbTabTitle>
      Tab1
    </ng-template>
    <ng-template ngbTabContent>
      Here is tab 1
    </ng-template>
  </ngb-tab>
</ngb-tabset>

Answer 1

如果没有Plunkr，有点难以理解，但一定要设置templateRef和＃

<app-content [templateRef]="nestedComponentRef"></app-content>
<template #nestedComponentRef>
    <component>
    </component>
</template>

以下是一个例子：https://embed.plnkr.co/zsG5ROJD1jYVIoXaR9Ga/

Answer 2

David Aguirre的评论认为这是一个依赖性问题，但它似乎至少部分归因于ng-bootstrap版本。

我遇到了同样的问题并注意到我的ng-bootstrap版本是1.0.0-alpha.24，但在https://ng-bootstrap.github.io/app/components/tabset/demos/basic/plnkr.html的示例中，config.js中的行是'@ng-bootstrap/ng-bootstrap': 'npm:@ng-bootstrap/ng-bootstrap@1.0.0-alpha.28/bundles/ng-bootstrap.js'

当我将该版本号降低到1.0.0-alpha.24时，我收到了下面的一堆错误消息。

将更改升级到1.0.0-alpha.28在我们的Web代码版本中有效，但在VCCode开发环境的代码中，我发现只需将<template>更改为{{1}和

<ng-template>

在package.json中

"@ng-bootstrap/ng-bootstrap": "^1.0.0-alpha.24",

还不足以解决问题，但是创建一个新的CLI实例解决了这个问题，所以必须有一些我找不到的依赖。

https://ng-bootstrap.github.io/app/components/tabset/demos/basic/plnkr.html与1.0.0-alpha.24的警告是：

"@ng-bootstrap/ng-bootstrap": "^1.0.0-alpha.28",

这是误导性的，因为代码使用Template parse warnings: The <template> element is deprecated. Use <ng-template> instead ("[WARNING ->]<template ngFor [ngForOf]="parts" let-part let-isOdd="odd"><span *ngIf="isOdd" class="{{highlightClas"): ng:///NgbTypeaheadModule/NgbHighlight.html@0:0，而不是警告中声明的<ng-template>元素。

错误消息的第一行是：

<template>

希望当其他人收到这些消息时，他们会找到这个帖子。

如果警告和错误消息没有那么误导和不清楚，那将会很有帮助。

Angular 2 ng-bootstrap，NgbTabset错误：未捕获（承诺）：TypeError：无法读取属性＆＃39; templateRef＆＃39;未定义的

2 个答案: