Search code examples
javascriptpolymerweb-component

How to fire the "iron-localstorage-load" event?

I'd like to load some data into my view. For now I am using the iron-localstorage element.

Because I want to use animations, I have to time the playing of the animation after the data from the iron-localstorage element has loaded.

According to the docs there is iron-localstorage-load Event that is:

Fired when value loads from localStorage.

https://elements.polymer-project.org/elements/iron-localstorage

But for some reason the event does not fire.

Here is what I use:

<iron-localstorage 
    name="library-storage" 
    value="{{value}}" 
    on-iron-localstorage-load-empty="initializeDefaultCards" 
    on-iron-localstorage-load="handleLocalstorageLoadEvent">
</iron-localstorage>

And here the method that should handle the load event:

handleLocalstorageLoadEvent: function() {
    alert('Localstorage Loaded');
},

Here is the Plnkr: (I used also an iron-ajax element, to show that event from iron-ajax are fired, compared to the event from iron-localstorage.

http://plnkr.co/edit/idN3fnNp8lbhR0jjx5Rs?p=preview

Solution

  • Your code doesn't set any value into value so it never saves to localstorage. Because of this, you can never load from localstorage.

    In your plunkr, if you change to {{cards}} you'd start to receive that event.