how to use Datepicker in Angular UI Modal

Question

i have string datepicker its working fine when i use in page but its not working when i use this datepicker in Angular UI modal '$uibModal'... how to use this i spend 4 hours in this issue but not its not working https://cdnjs.com/libraries/bootstrap-datetimepicker

  <div class="col-md-4">
            <div class="input-group date form_date " data-date="" data-date-format="dd-mm-yyyy" data-link-field="dtp_input2" data-link-format="yyyy-mm-dd">
                <input ng-model="FromDate" autocomplete="off" id="FromDate" class="form-control input-height" placeholder="Date" type="text">
                <span class="input-group-addon"><span class="fa fa-calendar"></span></span>
            </div>
        </div>



 var modalInstance = $uibModal.open({
            animation: this.animationsEnabled,
            templateUrl: '../../../Templates/AddModel.html',
            controller: 'RCtrl',
            scope: $scope,
            size: 'lg'
        });
        $scope.modalInstance = this.modalInstance;
        return modalInstance.result;

Answer 1

Here is your modified code:

var modalInstance = $uibModal.open({
      animation: this.animationsEnabled,
      templateUrl: '../../../Templates/AddModel.html',
      controller: 'RCtrl',
      scope: $scope,
      size: 'lg'
});

modalInstance.opened.then(function(){
   $timeout(function(){
     $('#FromDate').datetimepicker();
   }, 500) 
});

$scope.modalInstance = modalInstance;

return modalInstance.result;