删除 http://localhost:3001/formations/undefined 0 ()

Question

删除功能不再起作用。

我从 Delete HTTP 调用中删除了我的信息，它可以工作，但是当我在 angular2 部分前端使用时，它不再工作了。

错误 删除http://localhost:3001/formations/undefined0()

例外：响应状态：0 对于 URL：null

Subscriber.js:246 Uncaught Response {_body: ProgressEvent, status: 0, ok: false, statusText: "", headers: Headers, ...}

zone.js:2019 删除http://localhost:3001/formations/undefined0 ()

这是我的队形。服务

deleteFormation(id){
    return this.http.delete("http://localhost:3001/formations/"+id)
        .map(res => res.json());
  }

这是我的家。ts

import { Component, OnInit } from '@angular/core';
import { FormationService } from '../../services/formation.service';
import { Formation } from '../../../app/formation';
import {Observable} from 'rxjs/Rx';



@Component({
  selector: 'app-home1',
  templateUrl: './home1.component.html',
  styleUrls: ['./home1.component.css']
})
export class Home1Component implements OnInit {

  formation: Observable<Formation[]>;


  constructor(  
      public formationService:FormationService

  ) { };

  ngOnInit() {
    this.formation = this.formationService.getFormations();
   // this.getFormations();
  }

  getFormations(){
    this.formationService.getFormations()
        .subscribe(formation=>{
          this.formation = this.formation;
        })


}

deleteFormation(id) {
  this.formationService.deleteFormation(id)
    .subscribe(()=>{
      this.getFormations();
    });
}
}

这是我的家.html

<app-navbar1></app-navbar1>



<table class="table table-bordered">
  <thead>
    <tr>
      <td><b>Title</b></td>
      <td><b>url</b></td>
      <td><b>description</b></td>
      <td width="275" align="center"><b>Action</b></td>
    </tr>
  </thead>
  <tbody>  
     <tr *ngFor="let forms of formation  | async " >
        <td>{{forms.title}}</td>
        <td>{{forms.url}}</td> 
        <td>{{forms.description}}</td>
        <td width="275"> 
            <a class="btn btn-info" routerLink="/show/{{formation._id}}">Detail</a> 
            <a class="btn btn-success" routerLink="/edit/{{formation._id}}" >Edit</a>
            <a class="btn btn-danger" (click)="deleteFormation(formation._id)" >Delete</a>
        </td>
        </tr>


  </tbody>
</table>

Answer 1

您的代码的问题是您正在枚举*ngFor 中的集合，而不是将对象的实例传递给deleteFormation 方法，而是传递集合。

您需要拨打deleteFormation(forms._id)，而不是deleteFormation(formation._id)。 _id 不存在于您的 formation 数组中。

同样的问题也适用于您的 Detail 和 Edit 链接。