基本日期選擇器角js。重複輸入

我希望能夠使用角度js和引導來創建日期範圍選擇器。基本日期選擇器角js。重複輸入

我有兩個文本框，它們都打開日期選擇器框。但是它同時將日期輸入到兩個框中？

HTML片段

<div class="form-group"> 

     <div class="input-group"> 
      <input type="text" class="form-control date" id="dateFrom" placeholder="From" ng-click="open($event)" class="form-control" datepicker-popup="{{format}}" ng-model="dt" is-open="opened" min-date="minDate" max-date="'2015-06-22'" datepicker-options="dateOptions" date-disabled="disabled(date, mode)" ng-required="true" close-text="Close" > 
      <input type="text" class="form-control date" id="dateTo" placeholder="To" ng-click="open($event)" class="form-control" datepicker-popup="{{format}}" ng-model="dt" is-open="opened" min-date="minDate" max-date="'2015-06-22'" datepicker-options="dateOptions" date-disabled="disabled(date, mode)" ng-required="true" close-text="Close" > 
     </div> 

    </div>

JavaScript片段

angular.module('ui.bootstrap.demo', ['ui.bootstrap']); 
angular.module('ui.bootstrap.demo').controller('DatepickerDemoCtrl', function ($scope) { 

    $scope.open = function($event) { 
     $event.preventDefault(); 
     $event.stopPropagation(); 

     $scope.opened = true; 
    }; 
    $scope.formats = ['dd-MMMM-yyyy', 'yyyy/MM/dd', 'dd.MM.yyyy', 'shortDate']; 
    $scope.format = $scope.formats[1]; 
});

你可以看到working plunker example here

來源

2014-12-23 Robbo_UK

您正在使用同一模型兩個領域，NG-模型=」 DT「;

只需使用兩種不同的模式NG-模型= 「dtFrom」爲dateFrom和NG-模型= 「dtTo」爲dateTo：

<input type="text" class="form-control date" id="dateFrom" placeholder="From" ng-click="open($event)" class="form-control" datepicker-popup="{{format}}" ng-model="dtFrom" is-open="opened" min-date="minDate" max-date="'2015-06-22'" datepicker-options="dateOptions" date-disabled="disabled(date, mode)" ng-required="true" close-text="Close" > 
<input type="text" class="form-control date" id="dateTo" placeholder="To" ng-click="open($event)" class="form-control" datepicker-popup="{{format}}" ng-model="dtTo" is-open="opened" min-date="minDate" max-date="'2015-06-22'" datepicker-options="dateOptions" date-disabled="disabled(date, mode)" ng-required="true" close-text="Close" >

這裏是the working Plunker

上 ngModel

AngularJS文檔應該幫助不大，我認爲。

來源

2014-12-23 12:01:32

基本日期選擇器角js。重複輸入

回答

相關問題