angularjs: Aktualisiere Wert einer Variablen Nach externem Timeout Funktion Call

Question

Ich habe einen Controller und eine Fabrik. Eine Funktion (myfunc) in der Factory (searchFactory) wird durch einen Klick auf eine Schaltfläche aufgerufen. danach rufe ich eine Funktion (waitfunction) auf, die außerhalb des Controllers liegt. In dieser Funktion wird eine Zeitüberschreitung von 2 Sekunden verwendet und dann wird ein Wert geändert und an die Steuerung zurückgegeben. Wie kann ich sicherstellen, dass der Wert nach 2 Sekunden im Controller aktualisiert wird? JSfiddle: http://jsfiddle.net/zohairzohair4/cRr9K/1334/

var search_name 
var angularjsapp = angular.module('graphApp', ['ngAnimate', 'ui.bootstrap']); 

angularjsapp.factory('searchFactory', function() { 
    //return $resource('friends.json'); 
    return{ 
     myfunc:function(search_name){ 
      console.log('ok') 
      keyword_type = 1 
      loading_value = waitfunction(search_name) 
      console.log(loading_value) 
      return loading_value 
      } 
     } 
}); 

angularjsapp.controller('AccordionDemoCtrl', function($scope,searchFactory) { 
    $scope.count = 0; 
    $scope.namesPerPage = 10 
    $scope.currentPage = 1; 
    $scope.searchFactory = searchFactory.myfunc 
}); 

function waitfunction(search_name){ 
      value = 0 
      window.setTimeout(function() { 
         value = 1; 
        }, 2000); 
      return value   
     }; 

Answer 1

Sie benötigen $ timeout

$timeout(function() { 
       value=1; 
      }, 2000); 

Answer 2

Mit der setTimeout-Funktion zu verwenden, wird schmutzig Überprüfung Winkel des umgehen. Wenn Sie die Async-Funktionalität außerhalb der Angulars Dirty-Checking verwenden möchten, müssen Sie angular auslösen, um die Dirty-Prüfung erneut durchzuführen. Sie können wie folgt mit einer Funktion durch den Aufruf $scope.$apply(); oder wickeln Sie Ihren Asynchron-Anruf das tun:

$scope.$apply(function() { 
... 
}); 

Für Ihren spezifischen Bedarf - Winkel bereits eine Reihe von Asynchron-Methoden haben die Standard-JavaScript-ersetzen und ich würde Ihnen vorschlagen verwenden, die anstelle von Javascripts Timeout:

$timeout(function() { 
    value = 1; 
}, 2000); 

Sie können hier mehr über $ timeout lesen: https://docs.angularjs.org/api/ng/service/ $ timeout

Ihr waitfunction scheint nicht zu tun, was Sie wollen, dass es zu tun. Es wird den Wert lange vor dem Timeout zurückgeben. Dies geschieht, weil Sie nur einen einfachen Wert referenzieren. Wenn Sie ein Objekt übergeben und ändern, dass die Immobilienobjekte, dann können Sie erreichen, was Sie versuchen zu tun:

function waitfunction(search_name){ 
    var obj = { value: 0 }; 
    $timeout(function() { 
     obj.value = 1; 
    }, 2000); 
    return obj;  
}; 

Sie dann stattdessen auf die Rückkehr Objekte .value Eigenschaft binden müssen.

Ich sehe Ihren Plünderer und es gibt viel zu tun. Es scheint nicht so, als ob du das resultierende Objekt an irgendetwas bindest. Ich denke, dieser Beitrag hilft, das asynchrone Problem zu lösen, das mit dem Aufruf von setTimeout und dem Problem der Bindung an einfache Werte verbunden ist.