Дата, выбранная 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); 
  };

}

parameters jquery angularjs function-call jquery-ui-datepicker
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)


arrow_upward
2
arrow_downward

Такие сложные компоненты пользовательского интерфейса должны быть заключены в директиву для поддержания привязки данных модели. Для средства выбора даты jQuery вы можете проверить этот вопрос или поискать в Google "директиву jquery datepicker ".

person bdavidxyz    schedule 17.03.2014

arrow_upward
0
arrow_downward

Вы должны изменить весь подход. Использование директивы выбора даты jQueryUI:

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