ngDisabled Alternative für Link?

Question

Ich habe eine Liste auf meiner Seite mit Löschen-Taste für jedes Element. Die Taste ist nicht <button>, aber ist eigentlich ein fontawesome Symbol mit ng-click bei Methode von RESTful Service Hinweis:

<i class="fa fa-trash fa-lg pull-right" ng-click="deleteQuestion($id)"</i> 

Das Element wird nur aus dem Blickfeld entfernt werden, wenn Http-Anforderung abgeschlossen wird. Wenn der Benutzer das Symbol mehrmals zu schnell drückt, werden doppelte Anforderungen gesendet, und nur die erste wird erfolgreich sein, andere werden fehlschlagen, weil die Entität nicht existiert. Ich möchte die Schaltfläche (Symbol) deaktivieren oder keine doppelten Anfragen senden. Was ist der beste Ansatz?

Ich weiß, es gibt ngDisabled, aber ich kann es nicht verwenden, weil das Element nicht wirklich eine Schaltfläche ist, und ich möchte auch eine Schaltfläche blockieren. nicht alle gleichzeitig.

Answer 1

Sie können so etwas tun -

$scope.deleteQuestion(id) { 
    $scope.disabled = true; 
    $http.get('url') 
    .success(data){ 
     //other logic 
     $scope.removed = true; 
    } 
} 

Und in Ihrem Markup Sie haben können -

<i class="fa fa-trash fa-lg pull-right" ng-show="!removed" ng-disabled="deleted" ng-click="deleteQuestion($id)"</i> 

Dies ist der einfachste Weg, dies zu tun, aber sicher nicht die elegant.

Answer 2

Versuchen folgenden Ansatz :

Ausblick:

<i class="fa fa-trash fa-lg pull-right" ng-hide="remove" ng-click="deleteQuestion($id)"</i> 

Js Controller:

$scope.remove = false; 

$scope.deleteQuestion(id) { 
     $scope.remove = true; 
     $http.get('url') 
     .success(data){ 
      //other logic 
      $scope.remove = false; 
      } 
}