import { Directive , ElementRef , HostBinding , HostListener , OnDestroy } from '@angular/core' ; import { Subscription } from 'rxjs/Subscription' ; import { BsDropdownState } from './dropdown.state' ; @ Directive ( { selector : '[mdbDropdownToggle],[dropdownToggle]' , exportAs : 'bs-dropdown-toggle' } ) export class BsDropdownToggleDirective implements OnDestroy { private _subscriptions : Subscription [ ] = [ ] ; @ HostBinding ( 'attr.aria-haspopup' ) ariaHaspopup = true ; @ HostBinding ( 'attr.disabled' ) isDisabled : boolean | any = null ; @ HostBinding ( 'attr.aria-expanded' ) isOpen : boolean ; @ HostListener ( 'click' ) onClick ( ) { if ( this . isDisabled ) { return ; } this . _state . toggleClick . emit ( ) ; } @ HostListener ( 'document:click' , [ '$event' ] ) onDocumentClick ( event ) { if ( this . _state . autoClose && event . button !== 2 && ! this . _element . nativeElement . contains ( event . target ) ) { this . _state . toggleClick . emit ( false ) ; } } @ HostListener ( 'keyup.esc' ) onEsc ( ) { if ( this . _state . autoClose ) { this . _state . toggleClick . emit ( false ) ; } } constructor ( private _state , private _element ) { this . _subscriptions . push ( this . _state . isOpenChange . subscribe ( ( value ) => this . isOpen = value ) ) ; this . _subscriptions . push ( this . _state . isDisabledChange . subscribe ( ( value ) => this . isDisabled = value || null ) ) ; } ngOnDestroy ( ) { for ( const sub of this . _subscriptions ) { sub . unsubscribe ( ) ; } } }