AngularJS - Automatyczne aktualizowanie danych modelu

Witam,

Dopiero uczę się AngularaJS, stworzyłem pierwszy projekt, w którym chcę odczytać dane za pośrednictwem zapytania http. Funkcja, którą zastosowałem poprawnie pobiera mi wartość zmiennej i wyświetla ją na stronie:

todoApp.run(function ($http){
  $http.get("/cgi-bin/readVal.exe?var1").success(function (data){
  model.years = data;
});

Wartość zmiennej pobierana z tego zapytania zmienia się w czasie. Wartość zmiennej wyświetlam w widoku poprzez:

<h1>Rejestr 100 = {{todo.years}} </h1>

Problem polega na tym, że wartość pobierana jest tylko raz podczas ładowania strony. Ręczne odświeżenie strony aktualizuje tą wartość. Ja chciałbym zrobić taką funkcjonalność, by ta wartość była uaktualniana automatycznie, co określony czas.

Czy należy skorzystać z funkcji $interval? Czy muszę dopisać jakąś swoją dodatkową funkcję?

Bardzo proszę o pomoc w rozwiązaniu tego problemu.

Pozdrawiam.

Możesz użyć $timeout - https://docs.angularjs.org/api/ng/service/$timeout

Musisz to zadeklarować w dependencies kontrolera, dyrektywy:

app.directive('exampleDirective', [ '$timeout', function($timeout) { 
...

Pobieranie wrzucić do metody, w metodzie wywołać $tmieout:

$scope.refresh = function() {
$http.get("/cgi-bin/readVal.exe?var1").success(function (data){
model.years = data;
$rootScope.$timeoutPromise = $timeout($scope.refresh, 10000, false);
}

W samej dyrektywie wywołać metodę refresh():

...
$scope.refresh();
...
}]);

Po "uruchomieniu" dyrektywy, a w niej metody refresh(), dane zostaną odświeżone, zostanie ustawiony $timeout, kolejne wywołanie metody refresh() i ustawienie $timeout nastąpi po 10 skundach.

Przypisałem promise do $rootScope, co pozwala wyłączyć $timeout w innym kontrolerze/dyrektywie:

    if (typeof $rootScope.$timeoutPromise !== 'undefined' && $rootScope.$timeoutPromise.$$state.status !== 2) {
      $timeout.cancel($rootScope.$timeoutPromise);
    }

Dzięki za odpowiedź.

Nie za bardzo jeszcze rozgryzłem Twoją metodę.

Dla testu zrobiłem taką funkcję w kontrolerze:

$interval(function ($http){
   $scope.time=new Date().toTimeString();
   $http.get("/cgi-bin/readVal.exe?var1").success(function (data){
      model.years = data;});
},2000);
 

Wyświetlam dane za pomocą:
<h1>Zmienna: {{todo.years}} data: {{time}}<h1>

No i data mi się aktualizuje co 2 sekundy a zmienna nie - dlaczego to nie działa dla zmiennej?