Question

我想在段中有一个静态按钮，剩下的是动态的，我的动态部分正在工作，但我的静态段按钮没有显示所有产品

这是我的.html文件

<ion-content >

    <ion-segment [(ngModel)]="kmart" color="primary">
        <ion-segment-button value="All">
          All
        </ion-segment-button>
        <ion-segment-button *ngFor="let tabName of buttonName" value={{tabName.product_type}}>
          {{tabName.product_type}}
        </ion-segment-button>
  </ion-segment>

  <div [ngSwitch]="kmart" *ngFor = "let demo of demoObj">
  <ion-list *ngSwitchCase="All">
        <ion-item>
          {{demo.name}}
        </ion-item>
    </ion-list>
    <ion-list *ngSwitchCase="demo.product_type">
        <ion-item>
          {{demo.name}}
        </ion-item>
    </ion-list>
</div>

</ion-content>

这是我的.ts文件

demoObj = [ {"product_id": "52","name": "Apple - Fuji","product_type": "Fruits"},
              {"product_id": "53","name": "bana - Fuji","product_type": "Fruits"},
              {"product_id": "54","name": "beetroot - Fuji","product_type": "Vegitables"},
              {"product_id": "55","name": "beens - Fuji","product_type": "Vegitables"},
              {"product_id": "56","name": "mango - Fuji","product_type": "Fruits"}
            ];
  buttonName = [{"product_type": "Fruits"},{"product_type": "Vegitables"}];

问题：

这里第一次能够显示所有产品，但切换到另一个段然后我来到'所有'段我无法显示任何人都可以找到任何错误。

Answer 1

我认为value ='All'和* ngSwitchCase =“All”不匹配可能是导致错误

你的假设是正确的。为了将switch case设置为字符串文字，您需要在双引号中给出单引号。

 <ion-list *ngSwitchCase="'All'">
        <ion-item>
          {{demo.name}}
        </ion-item>
    </ion-list>

如何在静态离子段中显示所有对象

1 个答案: