Как запомнить данные?

Question

[Max]

Здравствуйте, помогите разобратся с хешем. Есть страница добавления товара:

<form ng-submit="addProduct()" ng-model="ap" >
      <h4 >Add Product</h4>
      <div class="form-group">
        <label>ID:</label><br>
        <input class="form-control" type="text" ng-model="ap.id" placeholder="Кодова назва продукту" required>
      </div>
      
       <div class="form-group">
        <label >Назва:</label><br>
        <input class="form-control" type="text" ng-model="ap.name" placeholder="Назва продукту" required>
      </div>
      
      <div class="form-group">
        <label>Опис:</label><br>
        <input class="form-control" type="text" ng-model="ap.description" placeholder="Опис продукту" required>
      </div>
      
      <div class="form-group">
        <label>Країна</label><br>
        <input  class="form-control"type="text" ng-model="ap.country" placeholder="Країна виробник" required>
      </div>

       <div class="form-group">
        <label>Калорії</label><br>
        <input  class="form-control"type="number" ng-model="ap.calories" placeholder="к-ть Калорій" required>
      </div>

       <div class="form-group">
        <label>Ціна</label><br>
        <input  class="form-control"type="number" ng-model="ap.price" placeholder="Ціна" required>
      </div>

       <div class="form-group">
        <label>Термін</label><br>
        <input  class="form-control" type="text" ng-model="ap.termin" placeholder="к-ть днів зберігання" required>
      </div>

       <div class="form-group">
        <label>Дата</label><br>
        <input  class="form-control" type="date" ng-model="ap.dataWugot" placeholder="Дата виготовлення" required>
      </div>
    <p><input class="btn btn-primary" type="submit"></p>
    </form>

И контроллер :

productApp.controller("addProducts", function ($scope, Products) {
     $scope.currentProduct = null;
     $scope.products = Products;
     $scope.setProduct = function (code) {
       $scope.currentAProduct = $scope.products.detail[code];
     };
     
     $scope.addProduct = function() {
       $scope.products.detail[$scope.ap.id] = $scope.ap;
       delete($scope.ap);
     };
  });

productApp.factory("Products", function () {
    var Products = {};
    Products.detail = {
        "milk": {
            "name": "Молоко", 
            "description": "Чудове молоко 2,5% жирності",
            "country": "Україна",
            "calories": "220 Ккал",
            "price": 12,
            "termin": 3,
            "dataWugot": "05.28.2015"
        },
        "cheese": {
            "name": "Сир", 
            "description": "Кращий твердий сир поділля",
            "country": "Казахстан",
            "calories": "300 Ккал",
            "price": 50,
            "termin": 14,
            "dataWugot": "04.23.2015"

        },
        "sour_cream": {
            "name": "Сметана", 
            "description": "Наша сметана 30%-вої жирності",
            "country": "Україна",
            "calories": "320 Ккал",
            "price": 20,
            "termin": 7,
            "dataWugot": "05.24.2015"
        },

        "beer": {
            "name": "Пиво", 
            "description": "Чернігівське світле пиво",
            "country": "Білорусь",
            "calories": "50 Ккал",
            "price": 12,
            "termin": 50,
            "dataWugot": "04.25.2015"
        },

        "whater": {
              "name": "Вода", 
              "description": "Солодка вода Караван",
              "country": "Україна",
              "calories": "90 Ккал",
              "price": 10,
              "termin": 90,
              "dataWugot": "03.11.2015"
        },

        "chocolate": {
            "name": "Шоколад", 
            "description": "Шоколад Milka",
            "country": "Білорусь",
            "calories": "250 Ккал",
            "price": 25,
            "termin": 21,
            "dataWugot": "04.17.2015"
        },

        "cherry": {
            "name": "Вишня", 
            "description": "Натуральна Казахстанська вишня вишня",
            "country": "Казахстан",
            "calories": "40 Ккал",
            "price": 90,
            "termin": 7,
            "dataWugot": "01.12.2015"
        }
    };
    return Products; 
});

Форма работает отлично и продукт добавляет, но при перезагрузке страницы добавленый продукт исчезает. Как это решеть? Ах да, БД использовать нельзя.
https://jsfiddle.net/6wup15fo/

Answer 1

[Alexander Tartmin]

localStorage - напишите сервис и на Products.detail накинте $watch в котором при изменении обновляёте данные в localStorage. При перезагрузке пусть сервис возвращает Вам или localStorage-а данные или если их там нет то заранее подготовленный объект.
Firebase (база данных конечно, но всё же гляньте, может подойтёт.)
ЗЫ: не понятны вот такие вещи
< form ng-model="ap">

$scope.addProduct = function() {
       $scope.products.detail[$scope.ap.id] = $scope.ap;
       delete($scope.ap);
     };

и не понятно зачем в фабрике Products вы создаёте объект, а потом в него вкладываете другой объект если можете сразу свойства второго объекта вложить и отдать сразу var Product;

Answer 2

[Павел Кононенко]

В localStorage записывайте.

$scope.addProduct = function() {
    var data = JSON.parse(localStorage.getItem("products")) || {};
    data[$scope.ap.id] = $scope.ap;
    localStorage.setItem("products", JSON.stringify(data));
    
    $scope.products.detail[$scope.ap.id] = $scope.ap;
    delete($scope.ap);
};

Забирать так:

productApp.factory("Products", function () {
    var Products = {};
    Products.detail =  JSON.parse(localStorage.getItem("products"));
    return Products; 
})

Comments

[Max]

Большое вам спасибо!!!) А не подскажете ещё как сделать удаление с LocalStorage. А то на простой странице без ангуляра у меня вышло, а в Ангуляре уже нет)

[Павел Кононенко]

Просто после удаления элемента полностью обновляйте localStorage новым значением products.

Answer 3

[Антон]

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

Comments

[Max]

К сожалению БД использовать нельзя( Нужно что-бы даные просто хранидись в хеше.

[Даниил Колесниченко]

Max: не хеше, а кэше

[Max]

Даниил Колесниченко: Емм.. это два совершенно разных понятия. hash это ассоциативный массив.

[Даниил Колесниченко]

Max: извиняюсь, думал это Вы перепутали
начинаешь сомневаться в том, что спрашивающий знает терминологию после таких вопросов
ну и в голове всплыли ассоциативные связи "сохранить данные" -> "кэш браузера" и "hash" -> "хэширование" :)

[Max]

Даниил Колесниченко: ахахахах)) ничего страшного))