为什么在Angular 2中GET有效,但DELETE和POST不起作用(错误:404)?

时间:2018-08-11 11:42:13

标签: angular post http-delete

实际上,我的http有效,get有效,但是deletepost不起作用。 你觉得我怎么办?

这是我的组件,我不知道为什么它不起作用

Component.ts

import { Component, OnInit } from '@angular/core';
import { Http, Response } from '@angular/http';
import 'rxjs/add/operator/map';
import { HttpService } from '../http.service';

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

export class HttpComponent implements OnInit {

      followers = [];
      constructor(private hService: HttpService,
        private http: Http
      ) { }

      private url: string = "./app/http/followers.json";


      ngOnInit() {
        this.http.get(this.url)
          .map((response: Response) => response.json())
          .subscribe(user=>this.followers=user)

      }

      createpost(input: HTMLInputElement) {
        let name = { name: input.value };
        input.value = '';

        this.http.post(this.url, JSON.stringify("name"))
          .subscribe(response => {
            name = response.json();
            this.followers.splice(0, 0, name);
          });
      }
      deletepost() {
        this.http.delete(this.url + '/' + "id")
          .subscribe(response => {
            let index = this.followers.indexOf("id");
            this.followers.splice(index, 1);
          });

      }


    }

这是我的http> follower.json

example-data

Component.html

<div>

  <h2>Followers list</h2>
  <input type="text" #name (keyup.enter)="createpost(name)" class="list-control">
  <button class="btn btn-primary" (click)="createpost(name)">Add to fallowers</button>


  <ul class="list-group">
    <li *ngFor="let follower of followers" class="list-group-item">
      <button class="btn btn-danger" (click)="deletepost(name)">UnFollow</button>
      {{follower.name}} 

    </li>
  </ul>
</div>

0 个答案:

没有答案