Как получить значения из диапазона выбора даты

Question

Я использую Date Range Picker for Bootstrap, чтобы выбрать диапазон дат, и все выглядит хорошо, моя единственная проблема в том, что после того, как я выбрал даты и отправлю форму, я не знаю как получить значения (даты), которые я выбрал.

Ниже вы можете увидеть мои daterangepicker настройки:

<input ui-jq="daterangepicker" ui-options="{ 
     format: 'DD-MM-YYYY', 
     startDate: '{{ first }}', 
     endDate: '{{ second }}', 
     separator: ' til ', 
     showWeekNumbers: true, 
     locale: { 
      applyLabel: 'Vælg datoer', 
      cancelLabel: 'Annuller', 
      fromLabel: 'Fra', 
      toLabel: 'Til', 
      firstDay: 1 
     } 
}" ng-model="plane.date" class="form-control" placeholder="Dato" /> 

Как вы можете видеть, что я пытался добавить ng-model, но все-таки не повезло.

Answer 1

У вас есть 2 варианта:

Установить его на событие применяются: (. Не забыть $ объем $ использовать часть)

angular.element('input#dataRange') = datePicker; 
datePicker.on('apply.daterangepicker', function (ev, picker) { 
       $scope.$apply(function() { 
        $scope.fromDate = picker.startDate.format("YYYY-MM-DD"); 
        $scope.toDate = picker.endDate.format("YYYY-MM-DD"); 
       }); 
      }); 

или получить значения в любое время:

angular.element('input#dataRange')= datePicker; 
$scope.fromDate = datePicker.data('daterangepicker').startDate.format("YYYY-MM-DD"); 
$scope.toDate = datePicker.data('daterangepicker').endDate.format("YYYY-MM-DD"); 

Это также полезно, если вы хотите, чтобы получить дату на потерю фокуса (размытие), если пользователь редактирует ввод вручную:

datePicker.on('blur', function (ev) { 
        $scope.$apply(function() { 
         $scope.fromDate = datePicker.data('daterangepicker').startDate.format("YYYY-MM-DD"); 
         $scope.toDate = datePicker.data('daterangepicker').endDate.format("YYYY-MM-DD"); 
        }); 
       });