Избраната от Jquery datepicker дата не се взема предвид в ng-change - AngularJS

Моля, помогнете ми да разреша този проблем. Използвам jquery datepicker с AngularJS. Опитвам се да получа избраната дата и да я предам с функция като параметър. За това използвам следния код.

Html:

<input type="text" "ng-model="gettingStartDate" ng-change="newTest(gettingStartDate)" />

Избор на дата:

$( "#date1" ).datepicker();

AngularJS:

function getOrg($scope, $http) {

  $scope.newTest = function(start_date){
     alert(start_date); 
  };

}

person Kirubanandan Kanagaraj    schedule 17.03.2014    source източник
comment
Всичко, което се случва в рамките на jQuery функция или плъгин, трябва да се приложи към Angular обхвата. Вижте $scope.$apply: docs.angularjs.org/api/ng/type/$ rootScope.Scope   -  person m.e.conroy    schedule 17.03.2014


Отговори (2)


Такива сложни компоненти на потребителския интерфейс трябва да бъдат обвити в директива, за да се поддържа обвързване на данните на модела. За jQuery datepicker можете да проверите този въпрос или да потърсите в Google „jquery datepicker директива ".

person bdavidxyz    schedule 17.03.2014

Трябва да промените целия подход. Използване на директива jQueryUI datepicker:

angular
    .module('App',['ui.date'])
    .directive('customDatepicker',function($compile){
        return {
            replace:true,
            templateUrl:'custom-datepicker.html',
            scope: {
                ngModel: '=',
                dateOptions: '='
            },
            link: function($scope, $element, $attrs, $controller){
                var $button = $element.find('button');
                var $input = $element.find('input');
                $button.on('click',function(){
                    if($input.is(':focus')){
                        $input.trigger('blur');
                    } else {
                        $input.trigger('focus');
                    }
                });
            }    
        };
    })

Вижте демонстрация

person newTag    schedule 17.03.2014