小编Jon*_*Jon的帖子

版本:

• Bootstrap 3.5.5
• AngularJS 1.4.7
• AngularUIB 0.14.3

我在选项卡页面中使用了一个uib-datepicker(使用uib-tabset)

<uib-tabset type='pills'>
  <uib-tab heading='HeatMap'>
    <input id='dateToImport' type='text' uib-datepicker-popup='yyyy-MM-dd' class='form-control' ng-change='changeDateTime()' ng-model='selectedDate' is-open='isDatePickerOpen' ng-click='openDatePicker($event)'/>
  </uib-tab>
</uib-tabset>

控制器代码:

app.controller("ctrl", function($scope, heatMapSvc){
  $scope.isDatePickerOpen = false;

  $scope.openDatePicker = function(){
    $scope.isDatePickerOpen = true;
    console.log("isDatePickerOpen?", $scope.isDatePickerOpen);
  };
});

选择输入时,datepicker日历将按预期显示.但是,一旦我选择了日期,就会在选择时重新显示日期选择器日历.我没有专注,重新聚焦控制,没有.在我的openDatePicker方法调用中,我写入控制台以确保调用该方法.每次我选择日期选择器(无论是否出现日历),控制器都会触发正确的方法.

我将日期选择器从包装的tabset中取出,并且datepicker正常工作(每个选择显示日历).我需要这个datepicker在我定义的uib-tabset中正常工作.