HTTP PUT Массив объектов

Я пытаюсь обновить список объектов в MongoDB с помощью всего одного вызова метода (для внутри Submit), но он не работает .. Я провёл вчера целый день и не смог заставить его работать .. У меня есть продукт в базе данных, и я хочу обновить все продукты с учетом продаж (у меня есть форма со всеми продуктами и поле ввода с продажами, я заполняю их все и нажимаю Сохранить).

Фронтенд: угловой Бэкэнд: Узел (с экспресс) База данных: MongoDB (mLab.com)

productSells.component.html (ввод для продажи):

    <input type = "number" id = "sells" class = "form-control"
        formControlName = "sells" value = "{{ product.sells }}">

productSells.component.ts

    products: Product[] = [];
    ngOnInit(): void {
    this.createFormControls();
    this.createForm();
    this.productService.getProducts()
      .subscribe(products => {
        this.products = products;
      },
        error => this.errorMessage = <any>error);
  }    
     createFormControls() {
    this.sells = new FormControl(0, [
      Validators.required
    ]);
  }    
  createForm() {
    this.sellsForm = new FormGroup({
      sells: this.sells,
    });
  }
  sellsSubmit() {
    for (const prod of this.products) {
      const product = new Product(
        this.sells.value
      );
      this.router.navigate([`/products/sells/${prod._id}`]);
      this.productService.updateProduct(prod._id, product);
    }
    location.reload();
  }

Узел:

iceRouter.route('/products/sells/:productId')
    .put((req, res) => {
        IceCream.findById(req.params.productId, (err, iceC) => {
            if (err) {
                res.status(500).send(err);
            }
            iceC.sells = req.body.sells;
            iceC.save();
            res.json(iceC);
        })
    })

product.service.ts - updateProduct ():

    updateProduct(pId: string, product: Product): Observable<any> {
    return this._http.put<Product>(`${this._productUrl}/${pId}`, product, this.httpOptions);
}

Если я использую почтальон с продуктом _id, я могу обновлять продажи, но не в приложении. Любая помощь будет принята с благодарностью. Спасибо.

@Edit - Добавлена ​​последняя версия кода:

productSells.component.html

<input name = "sells{{i}}" [(ngModel)] = "products[i].sells" 
    type = "number" class = "form-control" id = "sells" 
    formControlName = "sells" value = "{{ product.sells }}">

productSells.component.ts

  sellsSubmit() {
    for (let i = 0; i < this.products.length; i++) {
      const product = new Product(
        this.products[i].sells
      );
      this.router.navigate([`/products/sells/${this.products[i]._id}`]);
      this.productService.updateProduct(this.products[i]._id, product).subscribe(() => {
        console.info('sellsSubmit done!');
      });
    }
    location.reload();
  }

Коды:

ProductSells.component.html

ProductSells.component.ts

Product.service.ts

Похоже, вы обновляете данные внутри метода updateproduct класса ProductService, можете ли вы также опубликовать этот код.

Adrian Fâciu 19.05.2018 16:33

Привет, @ AdrianFâciu, спасибо за предложение. Я только что добавил updateProduct из product.service.ts в основной пост. Я все еще пытаюсь понять, почему он не работает, но безуспешно: /

Kauan Nagashi 19.05.2018 17:31
Стоит ли изучать PHP в 2026-2027 годах?
Стоит ли изучать PHP в 2026-2027 годах?
Привет всем, сегодня я хочу высказать свои соображения по поводу вопроса, который я уже много раз получал в своем сообществе: "Стоит ли изучать PHP в...
Поведение ключевого слова "this" в стрелочной функции в сравнении с нормальной функцией
Поведение ключевого слова "this" в стрелочной функции в сравнении с нормальной функцией
В JavaScript одним из самых запутанных понятий является поведение ключевого слова "this" в стрелочной и обычной функциях.
Приемы CSS-макетирования - floats и Flexbox
Приемы CSS-макетирования - floats и Flexbox
Здравствуйте, друзья-студенты! Готовы совершенствовать свои навыки веб-дизайна? Сегодня в нашем путешествии мы рассмотрим приемы CSS-верстки - в...
Тестирование функциональных ngrx-эффектов в Angular 16 с помощью Jest
В системе управления состояниями ngrx, совместимой с Angular 16, появились функциональные эффекты. Это здорово и делает код определенно легче для...
Концепция локализации и ее применение в приложениях React ⚡️
Концепция локализации и ее применение в приложениях React ⚡️
Локализация - это процесс адаптации приложения к различным языкам и культурным требованиям. Это позволяет пользователям получить опыт, соответствующий...
Пользовательский скаляр GraphQL
Пользовательский скаляр GraphQL
Листовые узлы системы типов GraphQL называются скалярами. Достигнув скалярного типа, невозможно спуститься дальше по иерархии типов. Скалярный тип...
0
2
592
1
Перейти к ответу Данный вопрос помечен как решенный

Ответы 1

Ответ принят как подходящий

Вам необходимо подписаться на вызов http.put, иначе HTTP-запрос не будет выполнен:

this.productService.updateProduct(prod._id, product).subscribe(() => {
    // This callback is invoked once the HTTP call has returned 
    console.info("Done");
});  

Привет @ user184994, спасибо за ответ. После того, как я воспользовался подпиской, метод заработал! Спасибо! Но есть проблема ... Все продукты обновляются с одинаковым значением (последнее), если я использую продажи 10, 20, 30, 40 в 4 разных продуктах соответственно, все они будут заканчиваться с Sells == 40: /

Kauan Nagashi 19.05.2018 18:36

Похоже, вы получаете значение из this.sells.value, а из this.sells кажется только 1, поэтому у него нет возможности узнать все 4 значения ...

user184994 19.05.2018 18:42

Ну, я думаю, что я идиот .. Да, я собирался прокомментировать это, хахаха Как я мог иметь "бесконечное" количество sellsInput, чтобы получить выгоду? (так как список товаров может быть бесконечным)

Kauan Nagashi 19.05.2018 18:42

В productSells.component.html есть ngFor для создания полей для отображения productName ({{product.productName}}) и ввода с id = "sells" из основного кода темы.

Kauan Nagashi 19.05.2018 18:44

Я думаю, что самый простой способ - сохранить значение для объекта продукта.

user184994 19.05.2018 18:45

Привет @ user184994, еще раз спасибо за уделенное время! Мне удалось решить проблему с помощью ngModel = products [i] .sells и сохранить вместо this.sells.value в this.products [i] .sells.

Kauan Nagashi 19.05.2018 20:04

@KauanNagashi Звучит идеально, рад, что у вас все получилось

user184994 19.05.2018 20:05

Теперь проблема заключается в следующем: когда я открываю модальное окно, оно переписывает все значения последним, допустим, первый продукт продает 10, а второй продает 30, в форме он показывает 30-30 (но в базе данных продает все в порядке) и выдает ошибку: ExpressionChangedAfterItHasBeenCheckedError: выражение изменилось после проверки. Предыдущее значение: «10». Текущее значение: '30'

Kauan Nagashi 19.05.2018 20:06

Я приму ваш ответ, так как он помог мне решить основную проблему темы: D

Kauan Nagashi 19.05.2018 20:07

@KauanNagashi Можете ли вы обновить код в своем вопросе, тогда, пожалуйста, я посмотрю

user184994 19.05.2018 20:14

Здравствуйте @ user184994, во-первых, ДЕЙСТВИТЕЛЬНО спасибо за ваше время, я очень благодарен вам за помощь! Извините за поздний ответ, я попытался переделать всю программу, но стало еще хуже: / Я обновил основной пост кодом. Спасибо: D

Kauan Nagashi 20.05.2018 00:04

Я добавил туда целые классы (ссылки в конце основного поста)

Kauan Nagashi 20.05.2018 00:13

Другие вопросы по теме