Question

我正在从API中检索记录，我想隐藏具有inventory_name = 'Better luck next time!'的记录。我正在尝试使用ngIf来完成当前代码，所有记录都被隐藏了。有人可以告诉我我做错了吗？谢谢

提供商

  getSpin(){
return this.http.get<GamesRecords>(`${this.dataApiUrl}//some api`,
  { headers: new HttpHeaders().set('X-XSRF-TOKEN', this.getCookie('XSRF-TOKEN'))});}

.ts页面

export class PrizesPage{


games: Games[];
  inventory_name: string = 'Better luck next time!';

  constructor(public navCtrl: NavController, public modalCtrl: 
  ModalController, public navParams: NavParams, public christmasProvider: 
  ChristmasProvider, private storage: Storage) {
    console.log('constructor Testpage');

    //christmasProvider.getDedi().subscribe();
  }


  ionViewDidLoad(){
    this.christmasProvider.getSpin().pipe(
      map((gamesResult: GamesRecords) => gamesResult && gamesResult.records)
    ).subscribe(gamed => {
        this.games = gamed;
        console.log(this.games);
  });

页面HTML

        <ion-item *ngFor ="let g of games" [ngClass]='g.inventory_name && g.status' tappable (click) = "gotoDetailspage(g.spin_result_id, g.inventory_id, g.display_name, g.status, g.inventory_name)">
      <ion-row *ngIf="!inventory_name">
      <ion-col align-self-start style="text-align: left;">
          <p>{{ g.display_name }} </p> 
          <p style="width: 100%">Prize Won: {{ g.inventory_name}}</p>
      </ion-col>

      <ion-col align-self-end style="vertical-align: auto; text-align: right;">
        <p [ngClass]='g.status'> {{ g.status }}</p> 
      </ion-col>
    </ion-row>
  </ion-item>

Answer 1

对于此行：

<ion-row *ngIf="!inventory_name">

您是要这样做吗？

<ion-row *ngIf="g.inventory_name !== inventory_name">

排除API中的记录-Ionic

1 个答案: