Bootstrap DateTimePicker with AngularJS: Passing directive ngModel value to controller
<p>I am trying to get angular bootstrap datetimepicker input value using a custom directive like shown below. I am able to get the value in directive. How can i access this directive scope value in angular controller.</p>

<p>HTML</p>

<pre><code>    &lt;div class='input-group date'  id='datetimepickerId' datetimez ng-model="dueDate" &gt;
          &lt;input type='text'  class="form-control" /&gt;
    &lt;/div&gt;
</code></pre>

<p>Controller</p>

<pre><code>App.directive('datetimez', function(){
    return {
        require: '?ngModel',
        restrict: 'A',
        link: function(scope, element, attrs, ngModel){
            if(!ngModel) return;  
            ngModel.$render = function(){
                element.find('#datetimepickerId').val( ngModel.$viewValue || '' );
            };
            element.datetimepicker({ 
                format : 'YYYY-MM-DD HH:mm:ss'
            });
            element.on('dp.change', function(){
                scope.$apply(read);
            });
            read();
            function read() {
                var value = element.find('#datetimepickerId').val();
                ngModel.$setViewValue(value);
                console.log(scope.dueDate);
            }
        }
    };
});

App.controller('myController', ['$scope', function($scope) {
    console.log($scope.dueDate);
}]);
</code></pre>

<p>Log inside the directive prints value successfully. But log inside controller does not.</p>