What things are common between browser tabs ? HTML5 Local Storage, Cookies. Now I will use HTML5 local storage for to store information between tabs. To maintain localStorage, you have to use ngStorage directive

Include below scripts

One is AngularJS minified JS file, ngStorage minified JS file
<script src="http://code.angularjs.org/1.4.7/angular.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/ngStorage/0.3.6/ngStorage.min.js"></script>

Script

Hold $localStorage to $storage of scope. Here you can assign default values using $default
angular.module('app', ['ngStorage']).controller('Ctrl', function($scope, $localStorage) {
    $scope.$storage = $localStorage.$default({
        name : 'jack'
    });
});

Markup

<input ng-model="$storage.name"/>

Demo

In this demo, you can see input changes will be reflected in Tab 2 
  Tab 1   Tab 2

Watch Local Storage Variable

Here you can watch entire local Storage like below
$scope.$storage = $localStorage.$default({
    name : 'jack'
});

$scope.$watch(function() {
      return angular.toJson($scope.$storage);
   }, function() {
      alert('The name is *** '+$scope.$storage.name);
});

Demo

In this demo, you will see alert from tab 3 from changes of Tab 1

6 comments:

  1. In anglar 2 how we do it the same functionality ?

    ReplyDelete
  2. Cisco 200-125 dumps Questions And Answers We Provide Our Customers With Latest and up-to-date Dumps Questions & Answers with 100% Exam Passing Guarantee. We Promise Exceptional Success in First Attempt.

    ReplyDelete
  3. Once your child enters middle school, you may give them a little more freedom when it comes to video games. However, it is important to still be aware, particularly when it comes to multiplayer games. Listen to make sure the language is appropriate. If not, take off the option for online play.
    free App Cleaner & Uninstaller 4.9 Crack
    free Windows 8.1 Pro Activator

    ReplyDelete
  4. The web site is lovingly serviced and saved as much as date. So it should be, thanks for sharing this with us. luyen nghe sau

    ReplyDelete
  5. We have established a company that guarantees quality assignments, even when projects seem too complicated ( https://grademiners.com/ ). We can make your college life easier by offering cheap papers on time. In this way, you will have more time for friends and fun. Read on to learn how you can benefit from our custom essay writing service.

    ReplyDelete

Blogroll

Popular Posts