angular - Angular2 html markup bind to boolean flag and call method when false -


i'm attempting write workaround angular2 bootstrap datepicker closes datepicker when user clicks outside.

i have working click outside registered , flips boolean flag here:

@component({     selector: 'ngbd-datepicker-popup',     templateurl: 'app/component/datepicker/datepicker.html',     host: {         '(document:click)': 'handleclick($event)'     } })  export class ngbddatepickerpopup {      private showdatepicker: boolean = true;       constructor(private elementref: elementref) {}        handleclick(event: any) {         if (!this.elementref.nativeelement.contains(event.target)) {             this.showdatepicker = false;         }      }  } 

the problem is, don't know there close datepicker. need call close() method markup because that's datepicker declared.

here's markup comments:

<form class="form-inline" bindtobooleanflaghere="d.close()"> <!--if true, close popup --!>     <div class="form-group">         <div class="input-group">             <input type="text" style="z-index: 0;" readonly class="form-control" placeholder="mm-dd-yyyy" firstdayofweek="1"                name="dp" [(ngmodel)]="date" (ngmodelchange)="datechange(date)" ngbdatepicker #d="ngbdatepicker"> <!-- datepicker declared here --!>             <div *ngif="!disablethis" class="input-group-addon" style="background-color: white; cursor: pointer" (click)="d.toggle()">                 <i class="glyphicon calendar"></i>             </div>         </div>     </div> </form> 

my datepicker object declared d here in html markup , external clicks registered in typescript. these external clicks flip boolean flag false.

so need html watch boolean flag , call d.close() method when showdatepicker false.

get reference of component , call close on it

@viewchild(ngbdatepicker) popup:ngbddatepickerpopup;  handleclick() {   if (!this.elementref.nativeelement.contains(event.target)) {      this.popup.close();   }  } 

i'm not sure if @viewchild() line correct, because don't understand code.


Comments