title: How to detect bootstrap datetimepicker change events within angularJS
body: <p>I am using this datetime picker in angular.</p>
  
  <p><a href="https://eonasdan.github.io/bootstrap-datetimepicker/" rel="noreferrer">https://eonasdan.github.io/bootstrap-datetimepicker/</a></p>
  
  <p>Inside of a controller I have:</p>
  
  <pre><code>$('#picker').datetimepicker();
  </code></pre>
  
  <p>In my HTML I have:</p>
  
  <pre><code>    &lt;div id="#picker" &gt;
          &lt;input type='text' style="font-size:10pt;" class="rptv-input" placeholder="Start Time" ng-model='adate' ng-change="datechange()" /&gt;
          &lt;span class="input-group-addon"&gt;
              &lt;span class="glyphicon glyphicon-calendar"&gt;&lt;/span&gt;
          &lt;/span&gt;
      &lt;/div&gt;       
  </code></pre>
  
  <p>Everything is managed by a controller "AppController".
  The problem is, when I select a date on the calendar by click, it does not trigger any "change" event (in other words, datechange is not fired). If I do a watch on ng-model "adate", it also does not seem to trigger it. If I type in the text box, then the scope variable changes.</p>
  
  <p>How can I detect changes on the text box if the user clicks on a date in the selector to change it?</p>