2017-10-09 97 views
0

我有一个列表与对象,在我的情况下演员。每个演员都有e删除按钮。每当我点击它,它应该从我的API上的JSON文件中删除对象,并立即刷新列表,以便删除的对象不再显示。然而,我的删除函数返回一个404错误,我似乎无法理解为什么。Angular2 http删除返回404

组件文件:

import { Component, OnInit } from '@angular/core'; 
import { Actor } from '../../model/actor'; 
import { ActorService } from '../../service/actor.service'; 

@Component({ 
    selector: 'app-list', 
    templateUrl: './actor-list.component.html', 
    styleUrls: ['./actor-list.component.scss'] 
}) 


export class ActorListComponent implements OnInit { 
    actors: Actor[]; 
    selectedActor: Actor; 
    constructor(private actorService: ActorService) { } 

    getActors(): void { 
     this.actorService.getActors().then(actors => this.actors = actors); 
    } 

    ngOnInit(): void { 
     this.getActors(); 
    } 
    delete(actor: Actor): void { 
     this.actorService 
      .delete(actor.id) 
      .then(() => { 
      this.actors = this.actors.filter(a => a !== actor); 
      }); 
    } 
} 

的HTML:

<button (click)="delete(actor); $event.stopPropagation()" > 
    <fa class="list-btn" [name]="'trash'"></fa> 
</button> 

和我的服务:

import { Injectable } from '@angular/core'; 
import { Actor } from '../model/actor'; 
import {Http, Headers, RequestOptions} from '@angular/http'; 
import 'rxjs/add/operator/toPromise'; 

@Injectable() 
export class ActorService { 
    private headers = new Headers({'Content-Type': 'application/json'}); 
    private actorsUrl = '/app/persons.json'; 
    constructor(private http: Http) { } 
    getActors(): Promise<Actor[]> { 
     return this.http.get(this.actorsUrl) 
      .toPromise().then(response => <Actor[]>response.json().personList) 
      .catch(this.handleError); 
    } 
    private handleError(error: any): Promise<any> { 
     console.error('Error: ', error); 
     return Promise.reject(error.message); 
    } 
    getActor(id: string): Promise<Actor> { 
     return this.getActors() 
      .then(actors => actors.find(actor => actor.id === id)); 
    } 
    delete(id: string): Promise<void> { 
     const options = new RequestOptions({headers: this.headers}); 
     const url = `${this.actorsUrl}/${id}`; 
     console.log('deleting actor ' + id); 
     return this.http.delete(url, options) 
      .toPromise() 
      .then(() => null) 
      .catch(this.handleError); 
    } 
} 

回答

1

你确定你是创建正确的URL? 仅当URL不正确时才会出现404。尝试发送与邮递员的请求。它总是帮助我。

+0

或有人返回很多人喜欢的NotFound。如果我试图删除的实体不存在,则返回404.很令客户感到困惑,因为他们需要以某种方式猜测URL是否错误或实体不存在。 –

+0

网址既适用于创建功能,也适用于更新功能,所以我不认为这会是错误的。但是,当我删除“.json”和私人actorsUrl结束它的工作。对我来说似乎很奇怪,考虑到更新和创建的URL是正确的,但嘿它现在有效! – Gurbii