引導UI日期選擇器彈出不工作

我有一個在利用引導UI庫v0.14.3我的web應用程序工作正常，下面的代碼片段：引導UI日期選擇器彈出不工作

HTML：

<div class="form-group"> 
    <label for="dateSelection">Reporting Period:</label> 
    <div class="input-group input-group-sm right-align"> 
     <input 
      id="dateSelection" 
      type="text" 
      class="form-control" 
      uib-datepicker-popup="{{ format }}" 
      popup-placement="bottom-right" 
      ng-model="date" 
      is-open="Calendar.opened" 
      datepicker-options="calendarOptions" 
      ng-required="true" 
      close-text="Close" 
      on-open-focus="false" 
      ng-change="chooseCustomDate(date)" 
      ng-disabled="true" /> 
       <span class="input-group-btn"> 
        <button 
         type="button" 
         class="btn btn-default" 
         ng-click="openCalendar()"> 
         <i class="fa fa-calendar"></i> 
        </button> 
       </span> 
    </div> 

</div>

控制器：

 var yesterdayDate = moment().subtract(1, 'days'); 
     $scope.selectedDate = $filter('date')(new Date(yesterdayDate), 'yyyy-MM-dd'); 
     $scope.forecastVarianceErrors = []; 
     $scope.LBossVarianceErrors = []; 
     $scope.PortalDifferenceErrors = []; 
     $scope.date = $scope.selectedDate; 
     $scope.dtInstance = {}; 
     $scope.showPortalDifferences = true; 
     $scope.showLBossVariances = true; 
     $scope.showForecastVariances = false; 
     $scope.format = 'EEEE, d MMMM, yyyy'; 


     /* 
     * Reporting Period 
     * 
     */ 
     $scope.chooseCustomDate = function(date) { 

      // Set the new date 
      $scope.selectedDate = $filter('date')(new Date(date), 'yyyy-MM-dd'); 

      // Empty the variance arrays 
      $scope.forecastVarianceErrors = []; 
      $scope.LBossVarianceErrors = []; 
      $scope.PortalDifferenceErrors = []; 

      // Redraw the datatable 
      $scope.dtInstance.reloadData(); 

     }; 


     $scope.openCalendar = function() { 

      $scope.Calendar.opened = true; 

     }; 


     $scope.Calendar = { 

      opened: false 

     }; 


     $scope.calendarOptions = { 
      startingDay: 1 
     };

然而，最近我所要求的功能，那也只是v2.1.4可用的引導UI的酥料餅的元素，所以我決定做TRAN切換到最新版本。

更新後，我注意到我的所有Datepicker Popups已停止工作。我沒有收到任何錯誤，只是彈出窗口似乎從未打開過。我正在努力尋找有關可能已經改變的信息，以查看我現在是否錯過了某些東西，或者需要以任何方式更改我的代碼。

如果我恢復到v0.14.3，我的Datepicker彈出窗口將再次開始工作。任何幫助表示讚賞。

來源

2016-10-04 Riples

好吧，我似乎是我自己的死亡原因。在我的控制之下，我將ng-disabled標記添加到<input>字段，以防止任何用戶手動篡改日期字符串。這似乎是v0.14.3允許的行爲，然而，v2.1.4並不適應。

通過將ng-disabled更改爲readonly標記，它允許再次繪製日曆控件。

另外我發現v2.1.4需要爲ng-model指定new Date();，否則它無法在<input>字段內呈現日期字符串。

來源

2016-10-05 23:48:21 Riples

引導UI日期選擇器彈出不工作

回答

相關問題