Получить идентификатор из formbuilder, чтобы удалить строку в Angular 6 - PullRequest
Новая
       22

Получить идентификатор из formbuilder, чтобы удалить строку в Angular 6

1 голос
/ 27 июня 2019

У меня есть страница HTML с несколькими формами для заполнения для пользователя: 

<div class="card-body">
  <form [formGroup]="FormCar" (ngSubmit)="AddCar(FormCar.value)">
    <input type="hidden" formControlName="CarId" id="carId" />
    <div class="row">
      <div class="form-group col-sm-3">
        <label>Brand</label>
        <input type="text" class="form-control" formControlName="Brand" id="brand" placeholder="Enter brand">
      </div>
    </div>
    <div class="row">
      <div class="form-group col-sm-3">
        <label>Model</label>
        <input type="text" class="form-control" formControlName="Model" id="model" placeholder="Enter model">
      </div>
    </div>
    <div class="row">
      <div class="form-group col-sm-3">
        <label>Color</label>
        <input type="text" class="form-control" formControlName="Color" id="color" placeholder="Enter color">
      </div>
    </div>
    <div class="row">
      <div class="form-group col-sm-3">
        <label>Speed</label>
        <input type="number" class="form-control" formControlName="TopSpeed" id="topSpeed" placeholder="Enter speed">
      </div>
    </div>
    <div class="btn-group mr-2">
      <button type="submit" class="btn btn-danger mr-1">Save changes</button>
      <button type="reset" class="btn btn-danger mr-1">New record</button>
      <button type="button" class="btn btn-danger mr-1" (click)="DeleteCar(CarId)">Delete</button>
    </div>
  </form>
</div>

Я использую таблицу HTML для отображения данных, и когда пользователь нажимает на строку, она заполняется входные данные информация.Я использовал этот метод для заполнения полей: 

EditCar(carId: number) {
    this.carservice.getCarById(carId).subscribe((res: any) => {
      this.FormCar.patchValue({
        CarId: res.carId,
        Brand: res.brand,
        Model: res.model,
        Color: res.color,
        TopSpeed: res.topSpeed
      })
    });
  }

Это хорошо работает. Я построил свою форму с помощью formbuilder следующим образом: 

  buildFormCar() {
    this.FormCar = this.formBuilder.group({
      CarId: ['', Validators.required],
      Brand: ['', Validators.required],
      Model: ['', Validators.required],
      Color: ['', Validators.required],
      TopSpeed: ['', Validators.required],
    });
  }

После полейзаполнены, я хочу удалить его по его id , и я использую этот метод для него: 

DeleteCar(carId: string) {
    if (confirm("Weet u zeker?")) {
      this.carservice.deleteCar(carId).subscribe(() => {
        this.GetCar();
        this.GetCarCount();         
      })
    }
  }

Когда я нажимаю на кнопку удаления, я получаю сообщение об ошибке на бэкэнде (я использую.NET core)

Это сообщение об ошибке:

System.InvalidOperationException: свойство 'CarId' для типа сущности 'Car' имеет временное значение при попытке изменитьсостояние объекта «Удалено».Либо задайте постоянное значение явно, либо убедитесь, что база данных настроена для генерации значений для этого свойства. '

Метод, который я использую в бэкэнде, выглядит следующим образом: 

 [Route("DeleteCar")]
 [HttpDelete]
 public IActionResult Delete(long id)
 {
   _context.Cars.Remove(new Car() { CarId = id });
   _context.SaveChanges();
   return Ok();
 }

Кажется, он не может найти carId, когда delete происходит.

Может кто-нибудь направить меня в правильном направлении?

1 Ответ

1 голос
/ 27 июня 2019

Попробуйте FormCar.get("CarId").value следующим образом: 

 <button type="button" class="btn btn-danger mr-1" (click)="DeleteCar(FormCar.get("CarId").value)">Delete</button>

или Donot не передайте любой параметр в DeleteCar() и сделайте это: 

DeleteCar() {
    if (confirm("Weet u zeker?")) {
      this.carservice.deleteCar(this.FormCar.get("CarId").value).subscribe(() => {
        this.GetCar();
        this.GetCarCount();         
      })
    }
  }
...