Wie Anker-Tags auf http Aufruf Erfolg

Question

Kann mir jemand helfen mit deaktivieren, wie Anker-Tag auf http Aufruf Erfolg zu deaktivieren und auf Fehler aktiviert und umgekehrt

Dies ist meine HTML-Seite

<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> 

Dies ist mein Controller

$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(); 

Answer 1

Eine reine AngularJS Lösung

In Ihrem success Rückruf

.success(function(data){ 

    $scope.disableAnchor = true; 

}) 

In Ihrem error Rückruf

.error(function(data){ 

    $scope.disableAnchor = false; 

}) 

Ihr Anker-Tag

<a ng-click='clickAnchor($event)' href="#your_href"> <a/> 

Dann in Ihrem Controller

$scope.clickAnchor = function($event){ 

    if ($scope.disableAnchor) 
     $event.preventDefault() 

} 

Eine nicht reine AngularJS Lösung

In Ihrem success Rückruf

.success(function(data){ 

    $("#your_anchor").on('click',function(e){ 
     e.preventDefault(); 
     return false 
    }) 

}) 

in Ihrem error Rückruf

.error(function(data){ 

    $("#your_anchor").on('click',function(e){ 
    }) 

}) 

Ich empfehleReine AngularJS Lösung.

Answer 2

Sie können Data-href verwenden, um das Anchor-Tag zu aktivieren und zu deaktivieren. Bitte sieh dir den Code an, hoffe, es wird dir helfen.

<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> 

Answer 3

können Sie die Click-Handler in Erfolg Aufruf unbind zurück jQuery mit

.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. 
}); 

Sie können sie zurückbekommen, wenn Sie wie unten angegeben wollen

$("#register_pointer").bind("click"); 
$("#register_pointer").css('pointer-events', ''); 

Answer 4

Meine bescheidene Meinung (die nicht einverstanden mit der Spezifikation - siehe discussion) ist, dass die ng-deaktiviert Direktive für diesen genauen Zweck erstellt wurde. Da das disabled-Attribut keine Auswirkung auf die Ankerelemente hat, ist es meine Aufgabe, es zu beheben:

a[disabled] { 
    pointer-events:none; 
} 

Example here

Beachten Sie, dass während der Zeiger-Ereignisse, die nicht auf IE < 11 unterstützt werden, es funktioniert immer noch, weil auch IE bestätigt das deaktivierte Attribut für Anker falsch. Andere Browser-Unterstützung ist pretty good.