Angular 2 ng-bootstrap，NgbTabset錯誤：未捕獲（承諾）：TypeError：無法讀取未定義的屬性“ templateRef”

Question

我嘗試使用NgTabset，但出現此錯誤TypeError：無法讀取未定義的屬性'templateRef'。當我用template標簽替換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時，出現了以下錯誤消息。

在Web上的代碼版本中進行的更改最大達到1.0.0-alpha.28，但是在VCCode開發環境中的代碼中，我發現只需將<template>更改為<ng-template> ，

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

在package.json中

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

還不足以解決問題，但是創建一個新的CLI實例可以解決此問題，因此必須存在我沒有找到的其他依賴項。

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

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>元素。

錯誤消息的第一行是：

ERROR TypeError: Cannot read property 'templateRef' of undefined

ERROR CONTEXT DebugContext_ {view: Object, nodeIndex: 3, nodeDef: Object, elDef: Object, elView: Object}

Unhandled Promise rejection: Cannot read property 'templateRef' of undefined ; Zone: <root> ; Task: Promise.then ; Value: TypeError: Cannot read property 'templateRef' of undefined

Error: Uncaught (in promise): TypeError: Cannot read property 'templateRef' of undefined

希望當其他人收到這些消息時，他們將找到此線程。

如果警告和錯誤消息沒有那么令人誤解和不清楚，這將很有幫助。