LocalStroage: подсчитать количество элементов в локальном хранилище и отобразить его в пользовательском интерфейсе, используя AngularJS

Question

У меня есть список продуктов, и я храню его в моем LocalStorage.Мой LocalStroage выглядит примерно так:

{
"2":{"id":"2","colour":"Black","size":"S","quantity":"1"},
"3":{"id":"3","colour":"Blue","size":"Universal","quantity":"1"},
}

Я хочу отобразить «2» в моем пользовательском интерфейсе (потому что у меня есть два элемента в LocalStorage).То, что я пробовал до сих пор:

 var temp = JSON.parse(localStorage["productTable"]);
        for(var i in temp) {
            totalitems ++;
        }
        itemsincart.innerHTML = '<i class=\"ion-android-cart\"></i><span id=\"cart-total\">'+totalitems+'</span>';

В этом я получаю totalitems как сумму id, что я знаю, неправильно.

И пробовал это Localstorage: Подсчитайте, сколько значений в ключе при использовании stringify , и в этом каждый раз я получаю '1'.

Может кто-нибудь помочь мне выяснить, как я могу показать количество элементов в моем LocalStorage?

Answer 1

Попробуйте,

var totalitems = JSON.parse(localStorage["productTable"]).length; 
itemsincart.innerHTML = '<i class=\"ion-android-cart\"></i><span id=\"cart-total\">'+totalitems+'</span>';

Answer 2

Вам не нужно использовать для цикла Object.keys(temp).length, чтобы получить длину объекта json, например, следующий фрагмент:

var temp = {
"2":{"id":"2","colour":"Black","size":"S","quantity":"1"},
"3":{"id":"3","colour":"Blue","size":"Universal","quantity":"1"},
};
console.log(Object.keys(temp).length+" items in cart");

В вашем случае попробуйте следующее:

var temp = JSON.parse(localStorage["productTable"]);
itemsincart.innerHTML = '<i class=\"ion-android-cart\"></i><span id=\"cart-total\">'+Object.keys(temp).length+'</span>';