Question

我的角度应用程序中有一个数据源，该数据源由HTTP服务/调用填充。我能够从远程服务器获取数据，使用该数据实时构建表并进行编辑。我现在希望能够从本地数据表中删除一行，而不是将更改推回服务器。但是我看不到在哪里可以访问数据数组。我知道它必须存储在某个位置的数组中，但是在哪里？大量不同的控制台日志使我无法更进一步地了解数据的实际位置，因此我可以对其进行操作。我的观察者工作正常，可以为我显示数据。这是数据源的代码：

import { Aircraft } from '../shared/aircraft';
import { AircraftInfoService } from './aircraft-info.service';
import { BehaviorSubject } from 'rxjs';
import { CollectionViewer, DataSource } from '@angular/cdk/collections';
import { Observable } from 'rxjs';
import { of } from 'rxjs';
import { catchError, finalize } from 'rxjs/operators';

export class AircraftInfoDataSource implements DataSource<Aircraft> {

  private className: string;

  private aircraftDBSubject = new BehaviorSubject<any[]>([]);
  private loadingSubject = new BehaviorSubject<boolean>(false);

  public loading$ = this.loadingSubject.asObservable();

  constructor(private aircraftInfoService: AircraftInfoService) {
    this.className = this.constructor.toString().match(/\w+/g)[1];

  }

  connect(collectionViewer: CollectionViewer): Observable<Aircraft[]> {
      return this.aircraftDBSubject.asObservable();
  }

  disconnect(collectionViewer: CollectionViewer): void {
      this.aircraftDBSubject.complete();
      this.loadingSubject.complete();
  }

  getAllAircraftData() {

      this.loadingSubject.next(true);

      this.aircraftInfoService.getAllAircraftRecords().pipe(
        catchError(() => of([])),
        finalize(() => this.loadingSubject.next(false))
      )
      .subscribe((data:any[]) => this.aircraftDBSubject.next(data));
  }

  deleteAircraft( deviceID: string ) {
    console.log(this.className, ' going to delte aircraft: ', deviceID);
    console.log('aircraftDBSubject: ', this.aircraftDBSubject);
    const foundIndex = this.aircraftDBSubject.value.findIndex(x => x.id === this.deviceID);
    console.log('foundIndex=',foundIndex);

  }
}

deleteAircraft函数是我遇到问题的地方。这也是检索数据的数据服务：

import { Aircraft } from '../shared/aircraft';
import { Injectable } from '@angular/core';
import { HttpClient } from '@angular/common/http';


@Injectable({
  providedIn: 'root'
})
export class AircraftInfoService {
  aircraft: Aircraft[];
  getApi = 'https://<removed>';

  constructor(private httpClient: HttpClient) {

  }

  ngOnInit() {
    console.log('aircraftInfoservice');
  }

  getAllAircraftRecords() {
    return this.httpClient.get(this.getApi)
  }
}

所以所有内容都是只读的，如何解决它以便也可以写（即删除记录）？

谢谢。...

如何从角度数据源中删除项目

0 个答案: