Обновить входную ng-модель после установки значения Jquery

Question

У меня был DatePicker, используя jquery Это работает, когда страница загружена, потому что я установил дату по умолчанию в моем контроллере. Выбор даты - это нормально, но проблема в том, что когда вы получаете значение с помощью углового js, оно не обновляется, всегда значение по умолчанию. Любой, как обновить значение, когда дата выбрана и установлена ​​с помощью jquery. Очень ценю вашу помощь и спасибо заранее.

HTML

<input type="text" id="date1"  name="date1" ng-model="data.date1">
<input type="text" id="date2"  name="date2" ng-model="data.date2">
<button type="button" ng-click="get()">Test Value</button>

JQuery

$('#date1').datepicker({
language: 'en',
autoClose:true,
dateFormat: 'd MM yyyy',
onSelect: function (fd, date, picker) {
}});

$('#date2').datepicker({
language: 'en',
autoClose:true,
dateFormat: 'd MM yyyy',
onSelect: function (fd, date, picker) {


}});

угловой JS

var app = angular.module('app', []);
app.controller('MainController', function($scope, $http){
 $scope.data = {};

 // default date
 $scope.data.date1  = new Date();
 $scope.data.date2  = moment(new Date()).add(1, 'days');

 $scope.get = function(){
    console.log($scope.data.date1);
    console.log($scope.data.date2);
 }});

Answer 1

Если вы собираетесь использовать datepicker более одного раза, я предлагаю создать директиву и просто использовать ее.

Директива

app.directive('datepicker', function() {
    return {
        restrict: 'A',
        require : 'ngModel',
        link : function (scope, element, attrs, ngModelCtrl) {
            $(function(){
                element.datepicker({
                    dateFormat:'dd/mm/yy',
                    onSelect:function (date) {
                        scope.$apply(function () {
                            ngModelCtrl.$setViewValue(date);
                        });
                    }
                });
            });
        }
    }
});

HTML

<input type="text" ng-model="date1" datepicker />
<input type="text" ng-model="date2" datepicker />

Для более подробной информации, просто проверьте это Плункер