Collapse component causes error #4967

5 Answer(s)

• 

  0

  ismcagdas created 6 years ago

  Support Team

  Hi,

  Can you share in which modules have you imported CollapseModule ? I think you should import CollapseModule into the module you are using it.

  You also need to import it into app.module like below;

  CollapseModule.forRoot()
  

  Save Cancel
• 

  0

  TimMackey created 6 years ago

  main-routing.module.ts

  ... // (additional imports)
  import { NgModule } from '@angular/core';
  import { CollapseModule } from 'ngx-bootstrap';
  
  @NgModule({
      imports: [
          CollapseModule.forRoot(),
  ...
  

  dashboard.component.html

  ...
      <button type="button" class="btn btn-primary"
              (click)="collapse.show()">Show content
      </button>
      <button type="button" class="btn btn-primary"
              (click)="collapse.hide()">Hide content
      </button>
      <hr>
      <div #collapse="bs-collapse" [collapse]="isOpen"
           class="card card-block card-header">
        <div class="well well-lg">Some content</div>
      </div>
  ...
  

  dashboard.component.ts

  import { Component, AfterViewInit, Injector, ViewEncapsulation, ElementRef, ViewChild } from '@angular/core';
  import { CollapseModule } from 'ngx-bootstrap';
  ...
  export class TtmDashboardComponent extends AppComponentBase implements AfterViewInit {
  ...
      isOpen = false;
  

  Save Cancel
• 

  0

  ismcagdas created 6 years ago

  Support Team

  Hi @TimMackey,

  Instead of main-routing.module.ts, can you include CollapseModule into main.module like below ?

  imports: [
          CollapseModule,
          ....
  ]
  

  Then, include it into app.module like below;

  imports: [
          CollapseModule.forRoot(),
          ....
  ]
  

  Save Cancel
• 

  0

  TimMackey created 6 years ago

  Your solution worked. Thank you!

  Save Cancel
• 

  0

  ismcagdas created 6 years ago

  Support Team

  Great :)

  Save Cancel