webentwicklung-frage-antwort-db.com.de

Wie verwende ich eine Verzögerung bei AngularJS?

Ich verwende den folgenden Code, in Laravel-Klinge

<div ng-show="displayErrorMsg" class="form-group m-b alert alert-danger">{{errorMsg}}

In der Winkelsteuerung

$scope.errorMsg = "Data Empty";
$scope.displayErrorMsg = true;
setTimeout(function() { $scope.displayErrorMsg = false;}, 2000);

Nachricht verschwindet nach 2 Sekunden nicht automatisch als gegeben.

Aber wenn ich einfach Alarm mache ("Test"); oder klicken Sie auf eine beliebige Stelle, bis die Nachricht verschwindet ... Wie löst man dieses Problem?

javascriptangularjs
26
Rita

Fügen Sie einfach $timeout in Ihren Controller ein und verwenden Sie diesen.

$timeout(function() { $scope.displayErrorMsg = false;}, 2000);

Sie können auch $ digest oder $ apply wie folgt verwenden

setTimeout(function() {
    $scope.displayErrorMsg = false;
    $scope.$digest();
}, 2000);

setTimeout(function () {
  $scope.$apply(function(){
      $scope.displayErrorMsg = false;
  });
}, 2000);

Überprüfen Sie hier, wie diese funktionieren,

http://www.sitepoint.com/understanding-angulars-apply-digest/

38
ctrl f5

Normalerweise brauche ich eine Funktion, um aus irgendeinem Grund etwas zu warten, nur zu Testzwecken. In Java können wir die Thread.sleep () verwenden. In JavaScript möchte ich jedoch eine einfache Funktion verwenden, die ich hier gefunden habe:

function sleep(milliseconds) {
  var start = new Date().getTime();
  for (var i = 0; i < 1e7; i++) {
    if ((new Date().getTime() - start) > milliseconds){
      break;
    }
  }
}

Es hat für mich in mehreren Szenarien gearbeitet, einschließlich AngularJS. Aber bitte, Denken Sie daran, dass diese Funktion in Produktionsumgebungen nur verwendet werden sollte, wenn Sie genau wissen, was Sie tun.

5
Almir Campos

Beispiel 1: setTimeout

var timerCount = function() {
    setTimeout(function () {
        $scope.displayErrorMsg = false;
        $scope.$apply(timerCount);
    }, 2000);
}

Beispiel 2: $ timeout

$timeout(function() { 
    $scope.displayErrorMsg = false;
}, 2000);
4
Banik

sie können $ Timeout injizieren. Angulars Warapper-Methode window.setTimeout.

probier diese :-

$timeout(function() { $scope.displayErrorMsg = false;}, 2000);

$ timeout hat die Struktur synatx: - $ timeout (fn, delay, invokeAny, pass)

fn-Funktion, die Sie verzögern möchten

verzögerung: - Zeitdauer

invokeAny: - Standardmäßig wird false gesetzt, andernfalls wird die Funktion fn innerhalb des Blocks $ apply aufgerufen

pass: - es ist ein optionaler Parameter, um die Funktion auszuführen.

Ein anderer Ansatz:- 

setTimeout(function () {
  $scope.$apply(function(){
      $scope.displayErrorMsg = false;
  });
}, 2000);

die setTimeout-Methode läuft aus Angular Context heraus. Daher müssen wir $ apply aufrufen, das $ digest cycle aufruft. Wenn Sie also $ scope innerhalb von setTimeout aktualisieren, muss Angular wissen, dass $ scope schmutzig wird. 

2
Pawan Kashyap

versuchen Sie, das Winkel-Timeout zu verwenden, um mehr https://docs.angularjs.org/api/ng/service/$timeout

oder Wie kann man den Wert mit delayjs nach einer Verzögerung ändern?

$timeout(function() { $scope.displayErrorMsg = false;}, 2000);
2
Imtiaz Pabel

Verbesserte Lösung 1:

$scope.errorMsg = "Data Empty";
$scope.displayErrorMsg = true;
if (timer) $timeout.cancel(timer); // restart counter
timer = setTimeout(function() { $scope.displayErrorMsg = false;}, 2000);

Lösung 1:

Sie können $ timeout verwenden:

$scope.errorMsg = "Data Empty";
$scope.displayErrorMsg = true;
setTimeout(function() { $scope.displayErrorMsg = false;}, 2000);

Lösung 2:

Mit setTimeout:

setTimeout(function () {
    $scope.$apply(function(){
        $scope.displayErrorMsg = false;
    });
}, 2000);
2
A-312

setTimeout ist die Methode des Fensterobjekts. Um auf diese Funktion zuzugreifen, fügen Sie $ window in den Controller ..__ ein. Dann können Sie eine beliebige Methode aufrufen, wie beispielsweise alert, confirm, setTimeout, setInterval usw. 
Details https://docs.angularjs.org/api/ng/service/$window
Dann können Sie schreiben 

$scope.errorMsg = "Data Empty";
$scope.displayErrorMsg = true;
$window.setTimeout(function() { $scope.displayErrorMsg = false;}, 2000);
1
Jagajit Prusty

Synchrone Lösung:  

const sleep = ( ms ) => {
    const end = +(new Date()) + ms;
    while( +(new Date()) < end ){ } 
}

Beispiel: 

(function() {
    console.log(+(new Date())); // 1527837689811
    sleep(1000);

    console.log(+(new Date())); // 1527837690813
    sleep(2000);

    console.log(+(new Date())); // 1527837692814
    sleep(3000);

    console.log(+(new Date())); // 1527837695814
    sleep(4000);

    console.log(+(new Date())); // 1527837699814
    sleep(5000);
})();
0
Юрий Волос