Collapse - nowzoo/nowzoo-angular-bootstrap-lite GitHub Wiki

Usage

<div nzbCollapse #collapse1="nzbCollapse" class="collapse">
  <p>
     Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
   </p>
</div>
<p>
 Status: {{ collapse1.status | async }}
</p>

Use ViewChild to grab the instance in your component:

export class SomeComponent implements AfterViewInit {
  @ViewChild('collapse1') collapse1: NzbCollapseDirective;
  ngAfterViewInit() {
    console.log(this.collapse1);
  }
}

Options

Use the native data- attributes.

Methods

  • show(): void A wrapper around the native method.
  • hide(): void A wrapper around the native method.
  • toggle(): void A wrapper around the native method.

Properties

  • status: Observable<string> One of:
    • 'uninitialized': The directive has not yet been initialized.
    • 'show': The show animation has started.
    • 'shown': The show animation has completed.
    • 'hide': The hide animation has started.
    • 'hidden': The hide animation has completed.
  • events: Observable<Event> Provides the native bootstrap collapse events as an observable.
⚠️ **GitHub.com Fallback** ⚠️