Hide the datepicker only when clicking outside
<p>I am using <a href="https://github.com/valor-software/ng2-bootstrap" rel="nofollow noreferrer">ng2-bootstrap datepicker</a> in my angular2 application. And I want to hide the datepicker popup on clicking outside. I tried the solution suggested in this <a href="https://stackoverflow.com/a/35713421/683634">question</a>. </p>

<p>But it doesn't work right, when choosing a date or switching to the months/year dialog, it closes the datepicker. </p>

<p>After investigation I discovered that the cause of this problem is that event target returned on click was not in the element ref initially but it is obtained on click with ngIf in the datepickers component implementation.</p>

<p>Here is a <a href="https://embed.plnkr.co/2Z8ntAMAWI5vZVN08tIe/" rel="nofollow noreferrer">plunker</a> addressing the issue.</p>

<p>Any suggestions how to solve this ?.</p>