Ich benutze den Knopf beim Laden des Inhalts, wenn der Benutzer auf den "Suchen" -Button klickt Inhalt wird zu diesem Zeitpunkt ButtonLabel wird in "Suchen" geändert und der Spinner wird angezeigt (Hier wird die Schaltfläche deaktiviert) . Nach dem Laden des Contents (Promise aufgelöst) wird ButtonLable wieder auf "Search" zurückgesetzt (Button wird hier aktiviert). Ich habe den folgenden Code ausprobiert, aber es zeigt immer den Spinner an.
HTML:
%Vor%Skript:
%Vor%Aktualisierte Geige: Ссылка
Alles, was Sie tun müssen, ist ng-show oder ng-hide Direktiven zu verwenden.
ng-show="Ausdruck"
%Vor% Dieser Bereich ist nur sichtbar, wenn searchButtonText einer Zeichenfolge 'Suchen' entspricht.
Sie sollten mehr über die Anweisungen von angular erfahren. Sie werden in Zukunft nützlich sein.
Viel Glück.
Demo Ссылка
Sie können auch diese einfache Anweisung verwenden:
Um es zu verwenden, fügen Sie einfach das Attribut button-spinner='loading' hinzu:
Es fügt einen Drehknopf innerhalb der Schaltfläche an, wenn Ihre loading Variable im Bereich wahr ist.
Füge einfach einen ng-show zu deinem Spinner hinzu:
und Controller:
%Vor% Wenn Sie dann Ihre Antwort erhalten, setzen Sie $scope.loading wieder auf false
Für Angular2 / 4 können Sie [verborgen] verwenden, um die Sichtbarkeit des Spinner zu steuern. Hier ist ein Plunker .
%Vor%Wo das Drehen definiert ist als:
%Vor%Und Ihre Komponente setzt einfach den Boolean, um die Sichtbarkeit des Spinner zu steuern. In diesem Beispiel drehen wir einfach 10 Sekunden lang.
%Vor%Tags und Links javascript angularjs twitter-bootstrap