Angular 未使用ng2引导定义NGBACordion类_Angular_Angular2 Directives_Ng2 Bootstrap

Angular 未使用ng2引导定义NGBACordion类

angular

Angular 未使用ng2引导定义NGBACordion类,angular,angular2-directives,ng2-bootstrap,Angular,Angular2 Directives,Ng2 Bootstrap,我试图实现一个简单的手风琴风格使用Angular 2和ng2引导。我使用Angular2快速启动文件作为起点，并修改了文件以添加ng2 bootstrap，bootstrap.css。index.html、app.module.ts、app.component.ts和app.component.html文件如下所示。ng2引导“警报”功能正常，但我收到“Accordion”元素的以下错误： zone.js:420 Unhandled Promise rejection: Template par

我试图实现一个简单的手风琴风格使用Angular 2和ng2引导。我使用Angular2快速启动文件作为起点，并修改了文件以添加ng2 bootstrap，bootstrap.css。index.html、app.module.ts、app.component.ts和app.component.html文件如下所示。ng2引导“警报”功能正常，但我收到“Accordion”元素的以下错误：

zone.js:420 Unhandled Promise rejection: Template parse errors:
There is no directive with "exportAs" set to "ngbAccordion" ("
<br> ......

app.component.ts

import { Component } from '@angular/core';

@Component({
  selector: 'my-app',
  templateUrl: './app/app.component.html'
})
export class AppComponent  { name = 'Angular'; }

app.component.html

<h1>Hello {{name}}</h1>
<alert type="success" dismissible="true">
    Well Done!
</alert>
<br>

<ngb-accordion #acc="ngbAccordion" activeIds="ngb-panel-0">
  <ngb-panel title="Simple">
    <template ngbPanelContent>
      Anim pariatur cliche reprehenderit, enim eiusmod high life accusamus terry richardson ad squid. 3 wolf moon officia
      aute, non cupidatat skateboard dolor brunch. Food truck quinoa nesciunt laborum eiusmod. Brunch 3 wolf moon tempor,
      sunt aliqua put a bird on it squid single-origin coffee nulla assumenda shoreditch et. Nihil anim keffiyeh helvetica,
      craft beer labore wes anderson cred nesciunt sapiente ea proident. Ad vegan excepteur butcher vice lomo. Leggings
      occaecat craft beer farm-to-table, raw denim aesthetic synth nesciunt you probably haven't heard of them accusamus
      labore sustainable VHS.
    </template>
  </ngb-panel>
  <ngb-panel>
    <template ngbPanelTitle>
      <span>&#9733; <b>Fancy</b> title &#9733;</span>
    </template>
    <template ngbPanelContent>
      Anim pariatur cliche reprehenderit, enim eiusmod high life accusamus terry richardson ad squid. 3 wolf moon officia
      aute, non cupidatat skateboard dolor brunch. Food truck quinoa nesciunt laborum eiusmod. Brunch 3 wolf moon tempor,
      sunt aliqua put a bird on it squid single-origin coffee nulla assumenda shoreditch et. Nihil anim keffiyeh helvetica,
      craft beer labore wes anderson cred nesciunt sapiente ea proident. Ad vegan excepteur butcher vice lomo. Leggings
      occaecat craft beer farm-to-table, raw denim aesthetic synth nesciunt you probably haven't heard of them accusamus
      labore sustainable VHS.
    </template>
  </ngb-panel>
  <ngb-panel title="Disabled" [disabled]="true">
    <template ngbPanelContent>
      Anim pariatur cliche reprehenderit, enim eiusmod high life accusamus terry richardson ad squid. 3 wolf moon officia
      aute, non cupidatat skateboard dolor brunch. Food truck quinoa nesciunt laborum eiusmod. Brunch 3 wolf moon tempor,
      sunt aliqua put a bird on it squid single-origin coffee nulla assumenda shoreditch et. Nihil anim keffiyeh helvetica,
      craft beer labore wes anderson cred nesciunt sapiente ea proident. Ad vegan excepteur butcher vice lomo. Leggings
      occaecat craft beer farm-to-table, raw denim aesthetic synth nesciunt you probably haven't heard of them accusamus
      labore sustainable VHS.
    </template>
  </ngb-panel>
</ngb-accordion>

Hello{{name}
做得好！


动物保护协会的陈词滥调，埃尼姆·埃乌斯莫德的高寿命accusamus terry richardson广告鱿鱼。3狼月办公厅
aute，非CUPIDATA滑板多洛早午餐。食品车奎奴亚藜。早午餐3狼月临时餐厅，
阿利夸在上面放了一只鸟鱿鱼单一来源的咖啡纳拉阿苏梅达·肖尔迪奇等Nihil anim keffiyeh helvetica，
工艺啤酒工人韦斯·安德森（wes anderson）cred nesciunt sapiente ea proident。纯素食主义者，屠夫副洛莫。绑腿
occaecat craft beer farm to table，生料牛仔布美学合成器Nescuint您可能从未听说过accusamus
labore可持续VHS。
★ 花式标题★；
动物保护协会的陈词滥调，埃尼姆·埃乌斯莫德的高寿命accusamus terry richardson广告鱿鱼。3狼月办公厅
aute，非CUPIDATA滑板多洛早午餐。食品车奎奴亚藜。早午餐3狼月临时餐厅，
阿利夸在上面放了一只鸟鱿鱼单一来源的咖啡纳拉阿苏梅达·肖尔迪奇等Nihil anim keffiyeh helvetica，
工艺啤酒工人韦斯·安德森（wes anderson）cred nesciunt sapiente ea proident。纯素食主义者，屠夫副洛莫。绑腿
occaecat craft beer farm to table，生料牛仔布美学合成器Nescuint您可能从未听说过accusamus
labore可持续VHS。
动物保护协会的陈词滥调，埃尼姆·埃乌斯莫德的高寿命accusamus terry richardson广告鱿鱼。3狼月办公厅
aute，非CUPIDATA滑板多洛早午餐。食品车奎奴亚藜。早午餐3狼月临时餐厅，
阿利夸在上面放了一只鸟鱿鱼单一来源的咖啡纳拉阿苏梅达·肖尔迪奇等Nihil anim keffiyeh helvetica，
工艺啤酒工人韦斯·安德森（wes anderson）cred nesciunt sapiente ea proident。纯素食主义者，屠夫副洛莫。绑腿
occaecat craft beer farm to table，生料牛仔布美学合成器Nescuint您可能从未听说过accusamus
labore可持续VHS。

我想你把事情搞糊涂了

您正在导入

ng2引导

lib并尝试使用

ng引导

组件

看和。

我想你把事情搞糊涂了

您正在导入

ng2引导

lib并尝试使用

ng引导

组件

请参阅和。

谢谢。这解决了问题。我发现找到Angular2与bootstrap、ng bootstrap、ng2 bootstrap和UI Angular的正确组合非常混乱。除了这个手风琴的问题，我特别努力应用引导flexbox的概念。列偏移似乎有效，但“对齐内容结束”等选项无效。再次感谢您的帮助。谢谢。这解决了问题。我发现找到Angular2与bootstrap、ng bootstrap、ng2 bootstrap和UI Angular的正确组合非常混乱。除了这个手风琴的问题，我特别努力应用引导flexbox的概念。列偏移似乎有效，但“对齐内容结束”等选项无效。再次感谢你的帮助。

import { Component } from '@angular/core';

@Component({
  selector: 'my-app',
  templateUrl: './app/app.component.html'
})
export class AppComponent  { name = 'Angular'; }

<h1>Hello {{name}}</h1>
<alert type="success" dismissible="true">
    Well Done!
</alert>
<br>

<ngb-accordion #acc="ngbAccordion" activeIds="ngb-panel-0">
  <ngb-panel title="Simple">
    <template ngbPanelContent>
      Anim pariatur cliche reprehenderit, enim eiusmod high life accusamus terry richardson ad squid. 3 wolf moon officia
      aute, non cupidatat skateboard dolor brunch. Food truck quinoa nesciunt laborum eiusmod. Brunch 3 wolf moon tempor,
      sunt aliqua put a bird on it squid single-origin coffee nulla assumenda shoreditch et. Nihil anim keffiyeh helvetica,
      craft beer labore wes anderson cred nesciunt sapiente ea proident. Ad vegan excepteur butcher vice lomo. Leggings
      occaecat craft beer farm-to-table, raw denim aesthetic synth nesciunt you probably haven't heard of them accusamus
      labore sustainable VHS.
    </template>
  </ngb-panel>
  <ngb-panel>
    <template ngbPanelTitle>
      <span>&#9733; <b>Fancy</b> title &#9733;</span>
    </template>
    <template ngbPanelContent>
      Anim pariatur cliche reprehenderit, enim eiusmod high life accusamus terry richardson ad squid. 3 wolf moon officia
      aute, non cupidatat skateboard dolor brunch. Food truck quinoa nesciunt laborum eiusmod. Brunch 3 wolf moon tempor,
      sunt aliqua put a bird on it squid single-origin coffee nulla assumenda shoreditch et. Nihil anim keffiyeh helvetica,
      craft beer labore wes anderson cred nesciunt sapiente ea proident. Ad vegan excepteur butcher vice lomo. Leggings
      occaecat craft beer farm-to-table, raw denim aesthetic synth nesciunt you probably haven't heard of them accusamus
      labore sustainable VHS.
    </template>
  </ngb-panel>
  <ngb-panel title="Disabled" [disabled]="true">
    <template ngbPanelContent>
      Anim pariatur cliche reprehenderit, enim eiusmod high life accusamus terry richardson ad squid. 3 wolf moon officia
      aute, non cupidatat skateboard dolor brunch. Food truck quinoa nesciunt laborum eiusmod. Brunch 3 wolf moon tempor,
      sunt aliqua put a bird on it squid single-origin coffee nulla assumenda shoreditch et. Nihil anim keffiyeh helvetica,
      craft beer labore wes anderson cred nesciunt sapiente ea proident. Ad vegan excepteur butcher vice lomo. Leggings
      occaecat craft beer farm-to-table, raw denim aesthetic synth nesciunt you probably haven't heard of them accusamus
      labore sustainable VHS.
    </template>
  </ngb-panel>
</ngb-accordion>