Bootstrap 3 DateTimePicker
をeonasdan
から使用しようとしています。すべてが機能していますが、入力内の実際の日付をangle ng-modelにバインドすることで問題を満たしました。ピッカーを使用してデータを変更しているときに、 'dp.change'イベントが機能しています。日付が入力内で変更されていますが、スペースバーやその他のキーを押してng-modelのアップデート検出を行う必要があります。ブートストラップ3 DateTimePicker - 'dp.change'の後に角型モデルへのバインドが機能しない
コードのいくつかの平和:角度指令と
JS:
(function() {
'use strict';
var module = angular.module('feedApp');
module.directive('datetimepicker', [
'$timeout',
function ($timeout) {
return {
require: '?ngModel',
restrict: 'EA',
scope: {
options: '@',
onChange: '&',
onClick: '&'
},
link: function ($scope, $element, $attrs, controller) {
$($element).on('dp.change', function() {
//alert("change");
$timeout(function() {
var dtp = $element.data('DateTimePicker');
controller.$setViewValue(dtp.date());
$scope.onChange();
});
});
$($element).on('click', function() {
$scope.onClick();
});
controller.$render = function() {
if (!!controller) {
if (controller.$viewValue === undefined) {
controller.$viewValue = null;
}
else if (!(controller.$viewValue instanceof moment)) {
controller.$viewValue = moment(controller.$viewValue);
}
$($element).data('DateTimePicker').date(controller.$viewValue);
}
};
$($element).datetimepicker($scope.$eval($attrs.options));
}
};
}
]);
})();
HTML:
<div style="max-width: 250px">
<div class="input-group input-group-sm date">
<input type="text" class="form-control" options="{format:'DD.MM.YYYY HH:mm', locale:'pl'}" datetimepicker ng-model="feed.reminderDateTime" />
<span class="input-group-addon">
<span class="glyphicon glyphicon-calendar"></span>
</span>
</div>
</div>
この問題を解決するためにどのように任意のアイデア?私は感謝するでしょう。