Как сохранить несколько данных объекта Json в локальном хранилище и, если существует, как его обновить - PullRequest
Новая
       57

Как сохранить несколько данных объекта Json в локальном хранилище и, если существует, как его обновить

0 голосов
/ 03 мая 2019

В моем угловом проекте есть функция корзины. Сой нуждается в помощи от кого-либо.

1. Как проверить, что пользователь ранее добавлял в корзину (сопоставляя существующий идентификатор продукта в локальном хранилище с новым выбранным идентификатором продукта), теперь выбранный продукт.

2. Если ранее добавить в корзину, как его обновить (новое количество или новый тип в соответствии с существующим идентификатором продукта).

3. Если не добавили ранее, как перенести в локальное хранилище новый продукт под новым идентификатором продукта. Нельзя повлиять на другой выбранный продукт корзины

Угловой 7 кли

Product.components.ts 

constructor(private cartService:CartServicesService)

public addToCart(productId : any , productTypeStatus:any , quantityCount:any ){ 

var cartProductData = { 
  "productId": productId,
  "productSelectedTypeId": productTypeStatus,
  "productQuantity": quantityCount
};  

this.cartService.addToCart(cartProductData); //send data to cart-service.ts

}

Корзина-services.service.ts 

import { Injectable } from '@angular/core';

@Injectable({
  providedIn: 'root'
})
export class CartServicesService {

constructor() { }

public addToCart(cartData:any) {

 console.log(cartData);

 //save data in local storage------------------------------------
 localStorage.setItem('cartObject', JSON.stringify(cartData)); 

 }
}

В локальном хранилище 

Key   : cartObject
Value : {"productId":3,"productSelectedTypeId":null,"productQuantity":4}

Ответы [ 2 ]

2 голосов
/ 03 мая 2019

Что ж, шаги, которые вы упомянули в своем вопросе, в целом верны.Однако я бы порекомендовал вам хранить его как массив объектов, а не просто как отдельный объект.

Вот как вы можете получить данные корзины из вашего localStorage. 

let cart =  JSON.parse(localStorage.getItem('cartObject'));

Затем мы используем Array.some () , чтобы проверить, существует ли новый элемент в вашем списке покупок в корзине с cartObject. 

let isInCart = false;
if (cart) {
  isInCart = cart.some(item => item.productId === 
cartProductData.productId));
} else {
  cart = [];
}

Затем мы обрабатываем егона основе isInCart, который является логическим значением, которое указывает, существует ли элемент в корзине: 

if (isInCart) {
  cart.map(item => {
    if (item.productId === cartProductData.productId) {
      item.productQuantity += cartProductData.productQuantity;
    }
    return item;
  });
} else {
  cart.push(cartProductData);
}

Затем мы сохраняем обновленный cart в вашем localStorage: 

localStorage.setItem('cartObject', JSON.stringify(cart));
0 голосов
/ 03 мая 2019

localStorage хранит значения в ключе, паре значений.

1) Сделайте ключ уникальным для пользователя и сохраните его продукты.

2) Если несколько товаров хранятся в виде массива объекта корзины для ключа пользователя в качестве значения.

3) Если вы хотите обновить один товар в списке значений, найдитесписок из хранилища измените в нем требуемое значение, замените список в хранилище.(Поскольку это сопоставление, добавление другой пары с тем же ключом заменит / перезапишет существующие значения для этого ключа.)

4) Если вы хотите обновить весь список, просто замените значения для пользовательского ключа.

...