AngularJS вызывает метод, когда его получают новые данные в localStorage

Question

Я использую angularJS localalstorage, и я очень хорошо это внедрил, но проблема в коде.

Я хочу, чтобы localstorage получал новые данные, чтобы он автоматически вызывал функцию $scope.getAllContact().

Я пытаюсь решить эту проблему, потому что, например, я открыл две вкладки в браузере, если я что-то изменил в одной вкладке, последние изменения должны отразиться и на другой вкладке без перезагрузки и обновления.

Сначаласм. мой код:

app.controller('crudCtrl', function($scope, $http, $timeout, $localStorage, $sessionStorage) {

  $scope.getAllContact = function() {
    var data = $http.get("http://127.0.0.1:8000/api/v1/contact/")
    .then(function(response) {
      $scope.contacts = response.data;
      // show something if success
    }, function(response) {
      //show something error
    });
  };
  $scope.getAllContact();

  // below method will post data
  $scope.formModel = {}; 
  $scope.onSubmit = function () {
      $http.post('http://127.0.0.1:8000/api/v1/contact/', $scope.formModel)
      .then(function(response) {

        $localStorage.name = response.data;
        $timeout(function() {

          $scope.successPost = '';
        }, 4000);
        //below $scope will push data in client site if the request is success
        $scope.contacts.push(response.data);
        //if any error occurs, below function will execute
      }, function(response) {
        // do nothing for now
      });
  };
});

выше в $scope.onSubmit() methond, я также отправляю отправленные данные в localalstorage, поэтому мне нужно, чтобы если localstorage получал новые данные, он всегда выполнялся $scope.getAllContact() всегда автоматически без какого-либо обновления.

Кто-нибудь может решить эту проблему?

Answer 1

Использование события storage :

 angular.element(window).on("storage", $scope.getAllContact);

 $scope.$on("$destroy", function() {
     angular.element(window).off("storage", $scope.getAllContact);
 });

Для получения информации см.

• Справочник по API окна MDN - storage_event
• Справочник по MDN Web API - StorageEvent