jQuery datepicker只能工作一次angularJs

问题描述:

在我的angularjs应用程序中,我在div中使用jquery datepickerjQuery datepicker只能工作一次angularJs

<div class="col-md-6" ng-show="!viewMode"> 
    <input type="text" readonly focus-me="{{ DateOfBirthFocus }}" id="DateOfBirth" name="DateOfBirth" ng-model="DateOfBirth" placeholder="01-jan-1991" class="form-control date-picker" ng-keydown="DateOfBirth_KeyDown($event)" ng-blur="DateOfBirthFocus=false;" required> 
</div> 

这是第一次,当我加载网页,它工作完全正常,但后来我躲在这个div使用ng-show并再次显示,按要求日期选择器不能正常工作。它不会打开日历视图。我试过this solution但它没有帮助我。任何猜测我做错了什么或错过了什么?

任何形式的帮助将不胜感激。

+0

你能提供一个有效的plunkr /小提琴 –

这可能是因为在jQuery初始化时DOM元素不可用。添加指令来解决此问题:

myApp.directive('datePickerFoo', function() { 
    return { 
     restrict: 'A', 
     link: function (scope, element) { 
      $(element).datepicker(); 

      // And optionally add based on your given link 
      if (!$.datepicker.initialized) { 
       $(document).mousedown($.datepicker._checkExternalClick); 
       $.datepicker.initialized = true; 
      } 
     } 
    } 
}); 

考虑使用ui-bootstrap库通过角的UI团队编写的。你不需要这个jQuery依赖。