Question

编辑问题：我正在尝试从REST API中以JSON格式提取的对象数组中删除所选记录。我无法使用splice（）等数组方法删除记录。要使用HTTP的Delete（）方法，需要每条记录的唯一ID。但这里的问题是在提供的API中，记录没有“ID”信息。请参阅附图，了解数据的来源。

这是我的代码：

tasks.component.ts：

import { Component, OnInit, ViewChild } from '@angular/core';
import { TasksService } from '../tasks.service';
import { Router } from '@angular/router';
import { Subscription }   from 'rxjs/Subscription';
@Component({
  selector: 'app-tasks',
  templateUrl: './tasks.component.html',
  styleUrls: ['./tasks.component.css']
})
export class TasksComponent implements OnInit {

  constructor(private tasksService : TasksService) { }
  @ViewChild('newTaskForm') newTaskForm;
  tasks : any;
  data : any = {};
  taskData: Array<string>[];
  taskInfo;
  newData: Array<string> = [];
  subscription: Subscription;
  title: string;
  ngOnInit() {
      this.tasksService.getData()
      .subscribe(data => { this.taskData = data; console.log(data) })
  }

  onTaskSubmit(data) : void {
    this.newData.push(data);
    this.newTaskForm.reset();
  }
  deleteRow(rowNumber: number){
      this.newData.splice(rowNumber, 1);
      this.taskData.splice(rowNumber, 1); 
  }

}

tasks.service.ts
import { Injectable } from '@angular/core';
import { Http, Response } from '@angular/http';
import { Subject } from 'rxjs/subject';
import 'rxjs/add/operator/map';

@Injectable()
export class TasksService {
  private apiURL = "https://firestore.googleapis.com/v1beta1/projects/angular-task-e7f39/databases/(default)/documents/tasks";
  public newTaskSubject = new Subject<any>();
  tasksInfo$ = this.newTaskSubject.asObservable();

  constructor(private http: Http) { }
   getData(){
     return this.http.get(this.apiURL)
     .map((res:Response) => res.json());
   }
   addTasks(data){
     //data.title = "hello";
     this.newTaskSubject.next(data);
   }


}

//tasks.component.html (part of html where i have added the delete function and rowindex)

<table>
        <tbody>
          <tr *ngFor="let item of newData; let rowIndex = index">
            <td>{{ item.title }}</td>
            <td>{{ item.description }}</td>
            <td><button class="btn btn-primary" (click)="deleteRow(rowIndex)">Delete</button></td>
          </tr>
        </tbody>
      </table>

我在这里使用拼接功能： this.taskData.splice（rowNumber，1）; //它表示splice（）不是taskData的有效方法。

虽然它适用于“this.newData.splice（rowNumber，1）;”其中newData是一个数组，用于存储用户手动输入的数据。我正在保存taskData中从API获取的对象数组。我怎么能用splice方法从对象数组中删除记录？我做错了什么？

enter image description here

Answer 1

我可以在屏幕截图中看到你得到一个文件数组的对象，所以你需要从这个数组中获取数据

  ngOnInit() {
      this.tasksService.getData()
      .subscribe(data => { this.taskData = data.documents; })
  }

Angular 2：从REST API

1 个答案: