Question

我是编程新手。我尝试了这段代码，它成功删除了数据库中的数据，但不会刷新列表。请帮助我

这是我在 /instrument-list.component.ts

中使用的代码

 delete(instrument: Instrument_Model): void {  
    this.instrumenrService.deleteInstruments(instrument.traceNO)  
     .subscribe(data => {  
    this.instruments = this.instruments.filter(u => u!== instrument);  
    })  
  }

这是我在 /instrument-list-data.service.ts

中使用的代码

deleteInstruments(id: number):Observable<Instrument_Model> {  
  return this.http.delete<Instrument_Model>(this.baseUrl +"delete/"+id);  
}

当我添加cosole.log（）时，它将生成此错误

HttpErrorResponse {headers: HttpHeaders, status: 200, statusText: "OK", url: 
"http://localhost:8080/instrument/delete/13", ok: false, …}
error: {error: SyntaxError: Unexpected token s in JSON at position 0 at         
JSON.parse (<anonymous>) at XMLHtt…, text: "succesfully deleted"}
headers: HttpHeaders {normalizedNames: Map(0), lazyUpdate: null, lazyInit:ƒ}
message: "Http failure during parsing for                     
http://localhost:8080/instrument/delete/13"
name: "HttpErrorResponse"
ok: false
status: 200
statusText: "OK"
url: "http://localhost:8080/instrument/delete/13"
__proto__: HttpResponseBase

这是html模板

  <table style="border: 5rem;border-color: black ">
      <tr >
      <th>traceNO</th>
    <th>instrumentID</th>
    <th>operatorName</th>
    <th>operatorEmail</th>
    <th>price</th>
    <th>instrumentName</th>
    <th>Control</th>
          </tr>
      <tr *ngFor="let instrument of instruments">
  <td>{{instrument.traceNO}}</td>
<td>{{instrument.instrumentID}}</td>
<td>{{instrument.operatorName}}</td>
<td>{{instrument.operatorEmail}}</td>
<td>{{instrument.price}}</td>
<td>{{instrument.instrumentName}}</td>
<td><button id  (click)="delete(instrument)"> Delete</button></td>
      </tr>
</table>

这是 Instrument_Model 模板

export interface Instrument_Model{
traceNO: number,
instrumentID:string,
operatorName:string,
operatorEmail:string,
price:number,
instrumentName:string
}

请帮助我找出哪里出了问题。谢谢。

Answer 1

尝试使用以下代码更新delete()方法

delete(instrument: Instrument_Model): void {  
    this.instrumenrService.deleteInstruments(instrument.traceNO)  
     .subscribe(data => {  
    this.instruments = this.instruments.filter(u => u.traceNO !== instrument.traceNO);  
    })  
  }

Answer 2

问题出在后端。发生错误是因为我没有从后端传递json对象。谢谢大家的帮助

尽管数据库已成功更新，但是删除行后表将不会刷新

2 个答案: