Question

在我的Angular应用中，我想在删除后更新列表，但我不知道如何使用诺言

  delete(id: any) {
    this.missionService.deleteMission(id);
    // .then((res) => {
    //   this.missionsArray$[id] = null;
    //   this.missionsArray$ = this.getAllMissions();
    // }).catch((error) => {
    //   console.log('error', error);
    // });
  }

我尝试使用带注释的代码，它可以工作，但可以使相同数据的列表加倍（不删除项目）

我使用此功能来建立我的列表：

  getAllMissions(): any {

    this.missionService.readAllMissions().then(response => {

      response.forEach(mission => {
        if (mission.data.missionCreator === this._auth.user.id) {
          mission.data.id = mission.ref['@ref'].id;
          this.missionsArray$.push(mission.data);
        } else {
          this.missionsArray$ = [];
        }
      });
    });
  }

此功能可删除一项：

  delete(id: any) {
    this.missionService.deleteMission(id);
    // .then((res) => {
    //   this.missionsArray$[id] = null;
    //   this.missionsArray$ = this.getAllMissions();
    // }).catch((error) => {
    //   console.log('error', error);
    // });
  }

我尝试使用注释的代码，它可以工作，但是使用相同的数据（没有删除的项目）将我的列表加倍

您能解释一下如何使用Promise进行体面的刷新吗？

Answer 1

在重新加载数组之前先清空数组this.missionsArray$ = []。

delete(id: any) {
    this.missionService.deleteMission(id);
     .then((res) => {
       this.missionsArray$[id] = null;
       this.missionsArray$ = []
       this.getAllMissions();
     }).catch((error) => {
       console.log('error', error);
     });
  }

或者您可以splice现有阵列

delete(id: any) {
    this.missionService.deleteMission(id);
     .then((res) => {
      this.missionsArray$[id] = null;
      for (var i = 0; i < this.missionsArray$.length; i++) {
        if (this.missionsArray$[i].id == id) {
          this.missionsArray$.splice(i, 1)
        }
      }
    }).catch((error) => {
      console.log('error', error);
    });
  }

Answer 2

您可以通过删除项目后重新调用 getAllMissions() 来执行非常简单的操作。

delete(id: any) {
    this.missionService.deleteMission(id);
     .then((res) => {
        this.getAllMissions() //added line
     }).catch((error) => {
       console.log('error', error);
     });
  }

Answer 3

在您的情况下，由于要在同一阵列中再次推送而不重置它，因此您将获得复制的记录。所以：

getAllMissions(): any {
   this.missionsArray$ = []; \\ Reset here before pushing again into same array 
    this.missionService.readAllMissions().then(response => {

      response.forEach(mission => {
        if (mission.data.missionCreator === this._auth.user.id) {
          mission.data.id = mission.ref['@ref'].id;
          this.missionsArray$.push(mission.data);
        } else {
        \\ This is not correct, since for any mission which will not have "missionCreator" matching "this._auth.user.id", 
        \\ your complete array will be flushed, if this is intended then fine
          this.missionsArray$ = []; 
        }
      });
    });
  }

或者您可以使用：

Array.prototype.filter（）方法用于过滤删除的记录，在您执行删除操作后，还将保存您1个不必要的api调用-getAllMission ，因为您只是删除记录可以在客户端本身上将其过滤掉，只需在页面加载或任何其他操作中获取所有记录即可。

使用诺言删除后如何刷新我的列表

3 个答案: