0

시간 선택을 위해 AngularUI timepicker (https://angular-ui.github.io/bootstrap/)를 사용했습니다. 통합 후 시간을 선택하고 형식을 설정할 수 없었지만 datepicker와 같은 팝업을 표시해야합니다. 사용자가 시간 아이콘을 클릭하면 시간 선택을위한 팝업이 나타납니다. 아래 코드를 사용하여 피곤했지만 일하지 않았습니다.AngularUI Timepicker - 팝업 시간 선택

<input type="text" class="form-control" uib-timepicker-popup ng-model="mytime" is-open="popup1.opened" ng-change="changed()" hour-step="hstep" minute-step="mstep" show-meridian="ismeridian" ng-required="true" close-text="Close" />

나는 같은에 대한 plunker을 만들었습니다 - http://plnkr.co/edit/yv3xT8KbP6pD7tV46Clf?p=preview

어떻게 팝업에서 시간 선택을 표시합니까?

참조 - http://plnkr.co/edit/S8UqwvXNGmDcPXV7a0N3?p=preview

답변

0

당신은 timepicker를 모두 사용 함께 모달해야합니다 (시간 옵션을 선택 참조).

<p class="input-group"> 
    <input type="text" class="form-control" ng-model="mytime" /> 
    <span class="input-group-btn"> 
    <button type="button" class="btn btn-default" ng-click="open()"><i class="fa fa-clock-o"></i></button> 
    </span> 
</p> 

컨트롤러에

:

$scope.open = function (size) { 

var modalInstance = $uibModal.open({ 
    animation: $scope.animationsEnabled, 
    templateUrl: 'myModalContent.html', 
    controller: 'ModalInstanceCtrl', 
    size: size, 
    resolve: { 
    time: function() { 
     return $scope.mytime; 
    } 
    } 
}); 

modalInstance.result.then(function (selectedItem) { 
    $scope.mytime = selectedItem; 
}, function() { 
    $log.info('Modal dismissed at: ' + new Date()); 
}); 

}; 여기

는 예를

이 도움이 희망과 plunker입니다.

+0

이미 ui-bootstrap 파일을 포함하고 있으며 timepicker 용으로 다른 datetimepicker.js 파일을 포함하지 않는 것이 좋습니다. 각도 Ui로 작동하도록 변경할 수 있습니까? – Slimshadddyyy

+0

ui-bootstrap에서 찾을 수있는 시간 선택기 팝업을 제공하지 않습니다. 제발 조언. – Michael

+0

그리고 이것이 바로 사용자 정의가있는 곳입니다. 시간 선택 도구를 팝업으로 표시 할 수있는 방법이 있습니까? – Slimshadddyyy

-1

콘텐츠 템플릿을 정의 할 수있는 popover 지시문이 있습니다.

관련 문제