AngularJS Bootstrap日期選擇器彈出顯示第一次點擊不正確的日期

我正在初始化一個帶有日期函數的模型，並將其綁定到具有日期選擇器的輸入。AngularJS Bootstrap日期選擇器彈出顯示第一次點擊不正確的日期

<label>Begin Date</label> 
<div class='input-group date'> 
      <input ng-model="Main.BeginDate" class="form-control" onkeydown="return false" datepicker-popup="MM/dd/yyyy" show-weeks="false" is-open="BeginDate" ng-focus="BeginDate=true" ng-click="BeginDate=true" min-date="Main.MinDate" required/> 
      <span class="input-group-addon"> 
       <span class="glyphicon glyphicon-calendar"></span> 
      </span> 
</div>

首先點擊的日期選擇器顯示當前日期即使實際日期不同。然後再次單擊輸入時，日期選擇器彈出框重置爲正確日期。

我嘗試：用$filter

定製new Date()功能

格式化日期刪除min-date屬性

我怎麼彈出來顯示綁定到模型的日期？

我使用：

AngularJS V1.5.0
引導v3.3.6
角-UI-引導版本：0.13.4

首先點擊---- - >>>>>

第二次點擊----- >>>>

來源

2016-08-01 Mahesh

我檢查了這種情況，好像你使用的版本有些衝突。如果我使用角1.4.9或更低，並嘗試你的代碼似乎都工作。這裏有一個plunker向你展示。但是，只要我使用angular 1.5.0或更高版本，我就會面臨同樣的問題。你可以使用angular 1.4.9和angular-ui-bootstrap 0.13.4或者升級你的angular ui bootstrap版本。

的index.html

<!doctype html> 
<html ng-app="app"> 
    <head> 
    <script src="//ajax.googleapis.com/ajax/libs/angularjs/1.4.9/angular.js"></script> 
    <script src="//ajax.googleapis.com/ajax/libs/angularjs/1.4.9/angular-animate.js"></script> 
    <script src="//angular-ui.github.io/bootstrap/ui-bootstrap-tpls-0.13.4.js"></script> 
    <script src="example.js"></script> 
    <link href="//netdna.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" rel="stylesheet"> 
    </head> 
    <body> 

<div ng-controller="DateCtrl" style="padding:40px"> 
    <label>Begin Date</label> 
<div class='input-group date'> 
      <input ng-model="dt" class="form-control" onkeydown="return false" datepicker-popup="MM/dd/yyyy" show-weeks="false" is-open="BeginDateOpen" ng-focus="BeginDateOpen=true" ng-click="BeginDateOpen=true" min-date="Main.MinDate" required/> 
      <span class="input-group-addon"> 
       <span class="glyphicon glyphicon-calendar"></span> 
      </span> 
</div> 

</div> 
    </body> 
</html>

example.js

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

$scope.today = function(){ 
    $scope.dt = new Date(1998,1,5) 
} 
$scope.today(); 
});

來源

2016-08-02 11:11:27 Amit

感謝您的。我不能將Angular低於1.5，因爲其他庫依賴於該版本。我確實嘗試將UI-bootstrap從0.13.4更改爲1.0.0甚至2.0.1。但彈出窗口從未顯示出來。 https://plnkr.co/edit/15euZAV2vERLC6KS6Hgf。但我發現了另一種解決方法。我已經添加了答案。謝謝。 – Mahesh

正如@Amit提到的，這個問題似乎是因爲庫的版本之間的不兼容性。

基於提到的缺陷here，添加atttribute init-date的解決方案奏效。

<input ng-model="dt" class="form-control" 
     onkeydown="return false" datepicker-popup="MM/dd/yyyy" show-weeks="false" 
     is-open="BeginDateOpen" ng-focus="BeginDateOpen=true" ng-click="BeginDateOpen=true" 
     min-date="Main.MinDate" required 
     init-date="dt"/>

這裏是一個plunker

來源

2016-08-02 15:02:59 Mahesh

AngularJS Bootstrap日期選擇器彈出顯示第一次點擊不正確的日期

回答

相關問題