bootstrap datetimepickerがモーダルで動作しない

Question

私はブートストラップdatetimepickerを使用しています。通常は動作しています。しかしモーダルポップアップでは機能しません。何が問題なのか。

JS：

(function() { 
'use strict'; 

angular 
    .module('app.inspection') 
    .controller('mainCtrl', mainCtrl) 
    .controller('scheduleModalCtrl', scheduleModalCtrl); 

mainCtrl.$inject = ['$scope', '$state', '$modal']; 

function mainCtrl($scope, $state, $modal) { 

$scope.schedule_modal = function() { 
    var modalView = $modal.open({ 
    templateUrl:'schedule_modal.html', 
    backdrop: 'static', 
    controller: 'scheduleModalCtrl', 
    windowClass: 'modal-dialog-schedule' 
}); 
} 

scheduleModalCtrl.$inject = ['$scope', '$modalInstance']; 
function scheduleModalCtrl($scope, $modalInstance) { 
$('#date').datetimepicker({ 
    format: 'DD/MM/YYYY' 
}); 
} 
})(); 

schedule_modal.html

<div class="col-xs-12 col-sm-12 col-md-12"> 
<label for="insp-date" class="label-style">Date</label> 
<div class='input-group date' id='date'> 
    <input type='text' class="input-style" placeholder="dd/mm/yyyy"/> 
    <span class="input-group-addon"> 
    <span class="glyphicon glyphicon-calendar"></span> 
    </span> 
</div> 
</div> 

route.config.js：

.state('app.main', { 
url: '/manageinspection', 
title: 'Manage Inspection Page', 
controller: 'mainCtrl', 
templateUrl: helper.basepath('pages/main/main.html'), 
resolve: helper.resolveFor('bootstrap','moment','bootstrapDateTimePicker') 
}) 

私はlazyloadにしてroute.config resolveにmoment.jsとbootstrapDateTimePicker定数が含まれています。 datetimepickerはmainCtrl(main page)で開かれています。モーダルポップアップでは機能しません。つまり、scheduleModalCtrlです。

私はいくつかのソリューションを見つけましたが、彼らはui-bootstarp datepickerのためではなく、datetimepicker

Answer 1

のためにすべてです、あなたがangular-bootstrap-datetimepickerについて話していますか？

私も同じ問題がありました。 datepicker（ドロップダウンを使用）は、モーダル（少なくともブートストラップのモーダル）ではうまく動作しません。

私の緩和的な解決策は、一貫性を維持するために、入力フィールドのクリック時にドロップダウンイベントを無効にすることです。ドロップダウンイベントを実行するために、私はこのように「入力グループアドオン」を使用しています：

<iframe width="100%" height="300" src="//jsfiddle.net/NandoMB/tLpbzkfj/27/embedded/" allowfullscreen="allowfullscreen" frameborder="0"></iframe>