删除空 table 行 IONIC

Question

我正在使用 ionic 3，我正在尝试在 HTML 页面中打印数据，但是 table 行是空的，然后我得到了结果，所以我想删除空的开始部分！任何人都可以帮助我！！

这是我使用的代码

<ion-grid *ngSwitchCase="'fraude3'" padding>
                <ion-item *ngFor ="let n of flag" >
                    <div *ngIf="n.manualparice >0 || n.priceoverride>0">
                      <ion-row>
                        <ion-col class="adult" width-70>
                          <span ion-text color="primary"><strong>Item ID</strong> </span>
                        </ion-col>
                        <ion-col width-10 text-center>
                          <ion-icon name="remove-circle" class="text-2x" tappable (click)="minusAdult()" [hidden]="adults < 2"
                                    color="secondary"></ion-icon>
                        </ion-col>
                        <ion-col width-10 text-center>{{n.itemId}}</ion-col>
                        <ion-col width-10 text-center>
                          <ion-icon name="add-circle" class="text-2x" tappable (click)="plusAdult()" color="secondary"></ion-icon>
                        </ion-col>
                        </ion-row>
                      <ion-row>
                      <ion-col class="adult" width-70>
                        <span ion-text color="primary"><strong>Manual Price</strong> </span>
                      </ion-col>
                      <ion-col width-10 text-center>
                        <ion-icon name="remove-circle" class="text-2x" tappable (click)="minusAdult()" [hidden]="adults < 2"
                                  color="secondary"></ion-icon>
                      </ion-col>
                      <ion-col width-10 text-center>{{n.manualparice}}</ion-col>
                      <ion-col width-10 text-center>
                        <ion-icon name="add-circle" class="text-2x" tappable (click)="plusAdult()" color="secondary"></ion-icon>
                      </ion-col>
                        </ion-row>
                      <ion-row>
                        <ion-col class="adult" width-70>
                          <span ion-text color="primary"><strong>Price Override</strong> </span>
                        </ion-col>
                        <ion-col width-10 text-center>
                          <ion-icon name="remove-circle" class="text-2x" tappable (click)="minusAdult()" [hidden]="adults < 2"
                                    color="secondary"></ion-icon>
                        </ion-col>
                        <ion-col width-10 text-center>{{n.priceoverride}}</ion-col>
                        <ion-col width-10 text-center>
                          <ion-icon name="add-circle" class="text-2x" tappable (click)="plusAdult()" color="secondary"></ion-icon>
                        </ion-col>
                        </ion-row>
                      <ion-row>
                          <ion-col class="adult" width-70>
                            <span ion-text color="primary"><strong>Item Amount</strong> </span>
                          </ion-col>
                          <ion-col width-10 text-center>
                            <ion-icon name="remove-circle" class="text-2x" tappable (click)="minusAdult()" [hidden]="adults < 2"
                                      color="secondary"></ion-icon>
                          </ion-col>
                          <ion-col width-10 text-center>{{n.extendedAmount}}</ion-col>
                          <ion-col width-10 text-center>
                          <ion-icon name="add-circle" class="text-2x" tappable (click)="plusAdult()" color="secondary"></ion-icon>
                          </ion-col>
                        </ion-row>
                     </div>
                  </ion-item>
            </ion-grid>

Answer 1

将代码更新为以下内容：

<ion-grid *ngSwitchCase="'fraude3'" padding>
                <ng-container *ngFor ="let n of flag" >
                    <ion-item *ngIf="n.manualparice >0 || n.priceoverride>0">
                     <div>
                      <ion-row>
                        <ion-col class="adult" width-70>
                          <span ion-text color="primary"><strong>Item ID</strong> </span>
                        </ion-col>
                        <ion-col width-10 text-center>
                          <ion-icon name="remove-circle" class="text-2x" tappable (click)="minusAdult()" [hidden]="adults < 2"
                                    color="secondary"></ion-icon>
                        </ion-col>
                        <ion-col width-10 text-center>{{n.itemId}}</ion-col>
                        <ion-col width-10 text-center>
                          <ion-icon name="add-circle" class="text-2x" tappable (click)="plusAdult()" color="secondary"></ion-icon>
                        </ion-col>
                        </ion-row>
                      <ion-row>
                      <ion-col class="adult" width-70>
                        <span ion-text color="primary"><strong>Manual Price</strong> </span>
                      </ion-col>
                      <ion-col width-10 text-center>
                        <ion-icon name="remove-circle" class="text-2x" tappable (click)="minusAdult()" [hidden]="adults < 2"
                                  color="secondary"></ion-icon>
                      </ion-col>
                      <ion-col width-10 text-center>{{n.manualparice}}</ion-col>
                      <ion-col width-10 text-center>
                        <ion-icon name="add-circle" class="text-2x" tappable (click)="plusAdult()" color="secondary"></ion-icon>
                      </ion-col>
                        </ion-row>
                      <ion-row>
                        <ion-col class="adult" width-70>
                          <span ion-text color="primary"><strong>Price Override</strong> </span>
                        </ion-col>
                        <ion-col width-10 text-center>
                          <ion-icon name="remove-circle" class="text-2x" tappable (click)="minusAdult()" [hidden]="adults < 2"
                                    color="secondary"></ion-icon>
                        </ion-col>
                        <ion-col width-10 text-center>{{n.priceoverride}}</ion-col>
                        <ion-col width-10 text-center>
                          <ion-icon name="add-circle" class="text-2x" tappable (click)="plusAdult()" color="secondary"></ion-icon>
                        </ion-col>
                        </ion-row>
                      <ion-row>
                          <ion-col class="adult" width-70>
                            <span ion-text color="primary"><strong>Item Amount</strong> </span>
                          </ion-col>
                          <ion-col width-10 text-center>
                            <ion-icon name="remove-circle" class="text-2x" tappable (click)="minusAdult()" [hidden]="adults < 2"
                                      color="secondary"></ion-icon>
                          </ion-col>
                          <ion-col width-10 text-center>{{n.extendedAmount}}</ion-col>
                          <ion-col width-10 text-center>
                          <ion-icon name="add-circle" class="text-2x" tappable (click)="plusAdult()" color="secondary"></ion-icon>
                          </ion-col>
                        </ion-row>
                     </div>
                    </ion-item>
                  </ng-container>
            </ion-grid>

删除空 table 行 IONIC

delete empty table line IONIC

typescript

ionic-framework

ionic3

angular