删除项目后刷新离子列表

Question

我试图异步获取数据，而twitter rest API（获取我的tweet更具体），然后将其显示为卡。 我的问题是删除推文时，它不反映在我的应用程序中。

这是我的代码的一部分：

Twitter服务提供商。

fetchDataFromTwitter() {
    return this.httpReader = this.http.get('url').map((resp) => resp).catch((err: any) => {
      return Observable.of(undefined);
    });
  }

twitterList页面

public dataFromTwitter:any;
ionViewDidLoad() {
    this.tweetProvider.fetchDataFromTwitter().subscribe((data: any) => {
    ..
    ..
    ..
 some string manuplation..and iterate threw array of tweets
        this.dataFromTwitter.push({
          screenName:tweet.user.screen_name,
          placeOfId: tweet.full_text.slice(indexStart, indexEnd),
          userId: tweet.full_text.slice(indexStartForToken,indexEndForToken)
        })
      });
}

在twitterList.html页面的视图中

<ion-content padding>
  <div *ngIf="dataFromTwitter">
  <ion-card *ngFor="let data of dataFromTwitter">
    <ion-item>
      <h2 >user: {{data .placeOfId }}</h2>
    </ion-item>
    <p>token: {{data.userId}}</p>
    <ion-item>
</ion-content>

该示例可能有错误，但我希望这个主意很清楚。

Answer 1

为了在删除项目后刷新列表，您可以选择以下任何一种方法

1. 删除元素时，再次调用get item调用以刷新列表
2. 从数据源数组中删除（拼接）该元素，这将阻止数据显示在UI中。

我建议第二个更好。

Answer 2

也许你可以试试这个

为.html文件创建离子刷新器

<ion-refresher slot="fixed" (ionRefresh)="doRefresh($event)">
<ion-refresher-content pullingIcon="arrow-dropdown" pullingText="Pull to refresh" refreshingSpinner="circles"
  refreshingText="Refreshing...">
</ion-refresher-content>

在.ts上创建doRefresh（）方法

data: any; // contain array of my data

ngOnInit() {
  this.dataSampah();
}

async dataSampah() {
  this.session_storage().then(() => {
    this.postPrvdr.getData(`tps/invoice?id_tps=` + this.id_tps).subscribe(res => {
      this.data = res.data;
    }, err => {
      console.log(err);
    });
  });
}

doRefresh(event) {
  this.data = null; // this is replacement of splice
  this.ngOnInit(); // 
  setTimeout(() => {
    this.router.navigate(['/invoice-sampah']);
    event.target.complete();
}, 2000);