Bu plunk içinde Sürüklenebilir başlık çubuğuna sahip bir Açısal UI modelim var. Çubuğu sürüklediğinizde, tüm modal hareket eder. Sorun şu ki, fareyi nispeten hızlı bir şekilde yukarı ve aşağı hareket ettirirsek, imleç çubuğa odaklanmayı kaybeder ve modal durur. Herhangi bir fikrin nasıl düzeltileceği Başka herhangi bir yöntem de kabul edilir. HTMLSürüklenebilir Açısal UI Modal odağı kaybediyor
<body ng-app="app" ng-controller="ctl">
<script type="text/ng-template" id="myModalContent.html">
<div class="topbar">This is the title</div>
<div class="modal-header">
<h3 class="modal-title" id="modal-title">I'm a modal!</h3>
</div>
<div class="modal-footer">
<button class="btn btn-primary" type="button" ng-click="ok()">OK</button>
</div>
</script>
<button type="button" class="btn btn-default" ng-click="open()">Open me!</button>
</body>
JavaScript
var app = angular.module("app", ['ui.bootstrap']);
app.controller("ctl", function($scope,$uibModal,$timeout) {
var modalInstance;
$scope.open = function() {
modalInstance = $uibModal.open({
animation: false,
windowClass: 'the-modal',
templateUrl: 'myModalContent.html'
});
$timeout(function(){
$('.modal-content').draggable({
drag: function(event, ui) {
if(event.toElement.className.indexOf("topbar") == -1) return false;
}
});
},10);
};
});
güncellenen bakın ve çok garip davranır - bu noktada sürükle kaybeder gibi. Kod çok basit, yanlış bir şey olamaz. Şoktayım :( – Mikkel