Как отключить метки привязки при успешном завершении HTTP-звонков
Может ли кто-нибудь помочь мне в том, как отключить тэг привязки при успешном запуске HTTP и включить его при ошибке и наоборот
Это моя страница HTML
<a href="#" id="register_pointer" data-toggle="modal" data-target="#myModal1">
<div class="plus">
<i class="fa fa-2x fa-plus"></i>
</div>
<div class="register">
<h4>Create</h4>
<p>New Account</p>
</div>
</a>
Это мой контроллер
$scope.MqUser=[];
$scope.getMqUser = function() {
usSpinnerService.spin('spinner-1');
MQDetailsService.getUserDetails().success(function(data, status) {
console.log(data);
usSpinnerService.stop('spinner-1');
$scope.createQ = false;
$scope.MqUser = data;
console.log("Success in getting the user list");
console.log($scope.MqUser);
//I want the anchor tag to get disabled here using angular directive.
}).error(function(data,status){
//I want the anchor tag to get enabled here using angular directive.
$scope.createQ = true;
console.log(data);
if(status == 0){
$scope.networkError();
}
else{
$scope.fetchuserFail(data.message);
}
usSpinnerService.stop('spinner-1');
console.log("Failed to load the user list "+status);
})
}
$scope.getMqUser();
Ответы
Ответ 1
Чистое решение AngularJS
В обратном вызове success
.success(function(data){
$scope.disableAnchor = true;
})
В обратном вызове error
.error(function(data){
$scope.disableAnchor = false;
})
Ваш якорный тег
<a ng-click='clickAnchor($event)' href="#your_href"> <a/>
Затем в вашем контроллере
$scope.clickAnchor = function($event){
if ($scope.disableAnchor)
$event.preventDefault()
}
Не чистое решение AngularJS
В обратном вызове success
.success(function(data){
$("#your_anchor").on('click',function(e){
e.preventDefault();
return false
})
})
в обратном вызове error
.error(function(data){
$("#your_anchor").on('click',function(e){
})
})
Я рекомендую использовать решение Pure Angularjs.
Ответ 2
вы можете отвязать обработчик кликов при успешном обратном вызове с помощью jQuery
.success(function(data){
$("#register_pointer").unbind( "click" ) // unbind the click
$("#register_pointer").css( 'pointer-events', 'none' ); //this will also prevent all the events like hover,mouse over etc.
});
вы можете вернуть их, когда захотите, как указано ниже
$("#register_pointer").bind( "click" );
$("#register_pointer").css( 'pointer-events', '');
Ответ 3
Вы можете использовать data-href для включения и отключения привязанного тега. Посмотрите на данный код, надеюсь, он поможет вам.
<script type="text/javascript" src="http://code.jquery.com/jquery-latest.min.js"></script>
<input type=checkbox onclick="enableEdit(this)"/>
<div onclick="enable()">Enable</div>
<div onclick="disable()">Disable</div>
<a id="anc" data-href="call.html" href="#">click here</a>
<script type="text/javascript">
function enable() {
$('#anc').attr("href", $('#anc').data("href"));
}
function disable() {
$('#anc').attr("href", "#");
}
</script>
Ответ 4
Мое скромное мнение (которое не согласуется со спецификацией ) заключается в том, что для этой цели была создана директива ng-disabled, Поскольку атрибут disabled не влияет на элементы привязки, мне нужна его задача:
a[disabled] {
pointer-events:none;
}
Пример здесь
Обратите внимание, что, хотя события-указатели не поддерживаются в IE и 11, он по-прежнему работает, потому что IE также неправильно подтверждает отключенный атрибут на якорях. Другая поддержка браузера довольно хорошая.
