how to fetch collection from localstorage ??
Closed this issue · 9 comments
A good question, me too i was looking for the an answer, and after a little bit of tweaking i found out this:
// Let's say the name of the localStorage item is myData inside the collection
// localStorage attribute.
var Collection = Backbone.Collection.extend({
model:Model,
localStorage: new Backbone.LocalStorage("myData")
});
// now you have access to myData localStorage item
console.log(localStorage.getItem('myData');
// Now what you get from the previous instruction is an array of IDs representing
// the IDs of models inside the myData collection
//Now the key for each model inside the local storage is :
// collectionName + '-' + id(an element of the array localStorage.getItem('myData'))
// all models are stored in the one string joined by ','
var firstModel = localStorage.getItem('myData-'+localStorage.getItem('myData').split(',')[0]);
console.log(firstModel); // now you get the first model logged out to the screen
// Note here that each Model id is the same one stored inside
// the array localStorage.getItem('myData')
// Here is a simple example without too much talking :
var LOCALSTORAGE_NAME = 'myData';
var collectionOfIDs = localStorage.getItem(LOCALSTORAGE_NAME);
collectionOfIDs = collectionOfIDs.split(',') // because ',' is used to join model IDs in a single string stored in the variable collectionOfIDs
var models = collectionOfIDs.map(function(modelID){
return localStorage.getItem(LOCALSTORAGE_NAME + '-' + modelID);
});
console.log('models stored under the collection myData are : ',models);
Hope this helps and have a nice day :)You can check my fork for the Real world example as it is not yet an accepted PR
https://github.com/ismnoiet/Backbone.localStorage
in the README file
As simple as
var Collection = Backbone.Collection.extend({ localStorage: new LocalStorage('todos') })
var todos = new Collection
todos.fetch() Thank you @absolux for the direct answer, but if you want really to know how collection items are stored in the localStorage then my solution is here to show you how they are exactly stored in the there, you can also play around with it and see what you get :)
Thanks @ismnoiet for reply.
But, why should we direct access localStorage global object instead of the Backbone collection ?
@absolux Good question, my answer is for curious people who want to learn how things are stored, otherwise your answer is the direct one and should be used for real world usage.
Because sometimes you need to implement something like backbone collection with your own javascript framework or even just with your javascript code. for short use my solution to learn about real world implementation and your solution if you just need to use it and that's it :).
Hope this is a clear answer.
Hi guys,
Thanks for contributing this. I'll be updating the code to ES6 + modules soon which should make the implementation a little more obvious.
Regards,
Scott
I have just read this while struggling with how to permanently delete models in local storage. How can I achieve this as all the tricks I can think of failed.