Выполнение действий на неактивной странице в угловом

Question

Я новичок в AngularJS, исходя из фона jQuery. В настоящий момент я делаю первые шаги и создаю несколько страниц с Угловым.

Теперь я хотел добиться чего-то вроде этого: подумайте о приложении с двумя «страницами». Сначала это главная страница с текстом и т. Д., А с другой - с таймером. Таймер должен начинаться с 0 и считать каждую секунду бесконечной, сразу при запуске приложения. Это первое, чего я не могу достичь. Мой таймер запускается только при переходе на вторую страницу.

Вторая проблема: когда таймер работает, я хочу перемещаться по всем страницам приложения, и таймер должен по-прежнему рассчитывать в фоновом режиме. Ну, на данный момент он работает в фоновом режиме, но каждый раз, когда я перехожу к странице с помощью таймера, кажется, что там открывается другая задача, которая подсчитывает таймер, что приводит к очень редким и быстрым подсчетам.

На мой индекс html Я использую ng-view для вставки других страниц в ngRoute. Это прекрасно работает.

Моя страница таймера выглядит следующим образом:

<div ng-controller="TimeCtrl"> 
    <p>Counter: {{counter.getValue()}}</p> 
</div> 

Затем я написал контроллер таймера для моего приложения:

app.controller("TimeCtrl", function($scope, $interval, Counter){ 

    $scope.counter = Counter; 

    $interval(function(){ 
     $scope.counter.update(); 
    }, 1000); 
}); 

И есть счетчик завод:

app.factory("Counter", function() { 

    this.counter = 0; 

    var self = this; 

    return { 
     update : function() { 
      self.counter++; 
     }, 
     getValue : function() { 
      return self.counter; 
     } 
    } 
}); 

Я бы оцените любую помощь, поскольку Angular не приходит так легко для меня в начале.

Answer 1

Вместо использования $interval на контроллере, использовать его на обслуживание/завода:

app.factory("Counter", function ($interval) { 
    this.counter = 0; 
    var self = this; 

    $interval(function(){ 
     self.update(); 
    }, 1000); 

    return { 
     update : function() { 
      self.counter++; 
     }, 
     getValue : function() { 
      return self.counter; 
     } 
    } 
}); 

Таким образом, если ваш TimeCtrl разрушается (по любой причине), то счетчик будет по-прежнему получать приращение.

Обратите внимание, что каждый раз, когда вы повторно открываете страницу, которая создает новый TimeCtrl, также будет определен новый интервал. Вот почему вы получаете этот «нечастый и быстрый подсчет».

Что касается загрузки только на второй странице, убедитесь, что вы добавили услугу Counter в качестве зависимости от вашего основного контроллера, чтобы немедленно получить экземпляр службы (иначе счетчик не запустится). Если у вас нет главного контроллера, используйте run block:

app.run(function(Counter) { 
    // just inject the Counter so that it gets instantiated 
})