ngx引导是否支持Angular 4？如果支持，为什么会出现以下错误？

我在Angular 4应用程序中集成了ngx boostrap，如下所示。但是，我在浏览器控制台中遇到一个错误，它无法工作。ngx引导是否支持Angular 4？如果支持，为什么会出现以下错误？如何将ngx引导与Angular 4正确集成

浏览器控制台中出现错误

core.es5.js:1084 ERROR Error: Uncaught (in promise): Error: Template parse errors:
Can't bind to 'collapse' since it isn't a known property of 'div'. ("
</button>
<hr>
<div id="collapseBasic" [ERROR ->][collapse]="isCollapsed">
  <div class="well well-lg card card-block card-header">Some content</div>
"): ng:///DashboardModule/TreeViewComponent.html@52:24
Error: Template parse errors:
Can't bind to 'collapse' since it isn't a known property of 'div'. ("
</button>
<hr>
<div id="collapseBasic" [ERROR ->][collapse]="isCollapsed">
  <div class="well well-lg card card-block card-header">Some content</div>
"): ng:///DashboardModule/TreeViewComponent.html@52:24
    at syntaxError (compiler.es5.js:1540)
    at TemplateParser.parse (compiler.es5.js:12031)
    at JitCompiler._compileTemplate (compiler.es5.js:25782)
    at compiler.es5.js:25706
    at Set.forEach (<anonymous>)
    at JitCompiler._compileComponents (compiler.es5.js:25706)
    at createResult (compiler.es5.js:25591)
    at ZoneDelegate.invoke (zone.js:391)
    at Object.onInvoke (core.es5.js:4149)
    at ZoneDelegate.invoke (zone.js:390)
    at resolvePromise (zone.js:769)
    at resolvePromise (zone.js:740)
    at zone.js:817
    at ZoneDelegate.invokeTask (zone.js:424)
    at Object.onInvokeTask (core.es5.js:4140)
    at ZoneDelegate.invokeTask (zone.js:423)
    at Zone.runTask (zone.js:191)
    at drainMicroTaskQueue (zone.js:584)

在angular cli.json中

"styles": [
    "scss/style.scss",
    "../node_modules/ng2-toastr/bundles/ng2-toastr.min.css",
    "../node_modules/bootstrap/dist/css/bootstrap.min.css"
  ],

应用程序内模块.ts

import { BrowserAnimationsModule } from '@angular/platform-browser/animations';
import { CollapseModule } from 'ngx-bootstrap/collapse';

@NgModule({
  imports: [
    .....
    BrowserAnimationsModule,
    CollapseModule.forRoot()
  ],
 ..........

import { BrowserAnimationsModule } from '@angular/platform-browser/animations';
import { CollapseModule } from 'ngx-bootstrap/collapse';

@NgModule({
  imports: [
    BrowserAnimationsModule,
    CollapseModule.forRoot()
  ]
})

@Component({
  selector: 'tree-view',
  templateUrl: './tree-view.component.html',
  styleUrls: ['./tree-view.component.scss']
})
export class TreeViewComponent implements OnInit {

  isCollapsed = false;

  constructor() { 

  }

  ngOnInit() {
  }

}

在树状视图中.componenet.ts

import { BrowserAnimationsModule } from '@angular/platform-browser/animations';
import { CollapseModule } from 'ngx-bootstrap/collapse';

@NgModule({
  imports: [
    .....
    BrowserAnimationsModule,
    CollapseModule.forRoot()
  ],
 ..........

import { BrowserAnimationsModule } from '@angular/platform-browser/animations';
import { CollapseModule } from 'ngx-bootstrap/collapse';

@NgModule({
  imports: [
    BrowserAnimationsModule,
    CollapseModule.forRoot()
  ]
})

@Component({
  selector: 'tree-view',
  templateUrl: './tree-view.component.html',
  styleUrls: ['./tree-view.component.scss']
})
export class TreeViewComponent implements OnInit {

  isCollapsed = false;

  constructor() { 

  }

  ngOnInit() {
  }

}

在树视图.component.html中

<button type="button" class="btn btn-primary" (click)="isCollapsed = !isCollapsed"
        [attr.aria-expanded]="!isCollapsed" aria-controls="collapseBasic">Toggle collapse
</button>
<hr>
<div id="collapseBasic" [collapse]="isCollapsed">
  <div class="well well-lg card card-block card-header">Some content</div>
</div>

切换折叠

一些内容

请同时包括

组件.ts

，您只包括

组件.module.ts

。我已在app.module.ts和tree-view.componenent.ts中导入了

CollapseModule

尝试导入

而不包含
.forRoot（）
。签出此项：？我尝试了此操作，但出现了错误：在“@angular/animations”中找不到导出“AnimationBuilder”