Question

我有一个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'属性尝试更改实体的“汽车”时具有“临时”价值状态为“已删除”。明确设置永久值或确保数据库已配置为为此属性生成值。'

我在后端使用的方法如下：

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

似乎在发生删除时找不到carId。

有人可以指出我正确的方向吗？

Answer 1

像这样尝试FormCar.get("CarId").value：

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

或不要在DeleteCar()中传递任何参数，并执行以下操作：

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

从formbuilder获取ID以删除Angular 6中的一行

1 个答案: