tree: 00adc3b991f2394e822cd103af0cdab82e7c46e5 [path history] [tgz]
  1. .github/
  2. demo/
  3. test/
  4. .bower.json
  5. .gitignore
  6. .travis.yml
  7. bower.json
  8. CONTRIBUTING.md
  9. hero.svg
  10. index.html
  11. iron-localstorage.html
  12. README.md
polymer_1.8.1/bower_components/iron-localstorage/README.md

Build status

Demo and API docs

##<iron-localstorage>

Element access to Web Storage API (window.localStorage).

Keeps value property in sync with localStorage.

Value is saved as json by default.

Usage:

ls-sample will automatically save changes to its value.

<dom-module id="ls-sample">
  <iron-localstorage name="my-app-storage"
    value="{{cartoon}}"
    on-iron-localstorage-load-empty="initializeDefaultCartoon"
  ></iron-localstorage>
</dom-module>

<script>
  Polymer({
    is: 'ls-sample',
    properties: {
      cartoon: {
        type: Object
      }
    },
    // initializes default if nothing has been stored
    initializeDefaultCartoon: function() {
      this.cartoon = {
        name: "Mickey",
        hasEars: true
      }
    },
    // use path set api to propagate changes to localstorage
    makeModifications: function() {
      this.set('cartoon.name', "Minions");
      this.set('cartoon.hasEars', false);
    }
  });
</script>

Tech notes:

  • value.* is observed, and saved on modifications. You must use path change notification methods such as set() to modify value for changes to be observed.

  • Set auto-save-disabled to prevent automatic saving.

  • Value is saved as JSON by default.

  • To delete a key, set value to null

Element listens to StorageAPI storage event, and will reload upon receiving it.

Warning: do not bind value to sub-properties until Polymer bug 1550 is resolved. Local storage will be blown away. <iron-localstorage value="{{foo.bar}}" will cause data loss.