イオン2イオンセグメントng Forモデルのデータ

Question

私は最近Ionic 2を使い始めました。私のPWAのページの1つは、別のレストランの週メニューの情報を表示することになっています。

私がしようとしているのは、それぞれのレストランのメニューの間でページの内容を切り替えることができる、そのレストランのそれぞれのボタンが付いたイオンセグメントです。

以下は私のhtmlファイルの重要な部分です。問題のある行は<ion-list *ngSwitchCase=restaus.restName>です。

デフォルトでは、このページには「MISERICORDE」レストランの結果が表示されているにすぎませんが、クリックすると表示されます（クリックすると表示されます）。セグメントに対して何もしません。私は実際にはかなり同じことを何かを見つけることができませんので

this.restaurs = "MISERICORDE";

<ion-toolbar no-border-top > 
 
    <ion-segment [(ngModel)]="restaurs"> 
 
     <ion-segment-button *ngFor="let restaus of restaurants" value="{{restaus.restName}}"> 
 
      {{restaus.restName}} 
 
     </ion-segment-button> 
 
    </ion-segment> 
 
    </ion-toolbar> 
 

 
<div [ngSwitch]="restaurs"> 
 
     <div *ngFor="let restaus of restaurants"> 
 
     <ion-list *ngSwitchCase=restaus.restName> 
 
      <h2>{{restaus.restName}}</h2> 
 
      <ion-list no-lines> 
 
       <ion-item *ngFor="let menus of restaus.restMenus" > 
 
       {{menus.dayName}} 
 
       <ion-card text-wrap> 
 
        <ion-card-content> 
 
        <ion-item *ngFor="let dmenus of menus.dayMenus"> 
 
         <h3>{{dmenus.menuName}}</h3> 
 
         <ion-item> 
 
         Soupe<br /> 
 
         <button ion-button clear (click)="openMenu(dmenus.menuSoup)">{{dmenus.menuSoup}}</button> 
 
         </ion-item> 
 
         <ion-item> 
 
         Plat principal<br /> 
 
         <button ion-button clear (click)="openMenu(dmenus.menuMain)">{{dmenus.menuMain}}</button> 
 
         </ion-item> 
 
         <ion-item> 
 
         Accompagnement(s): 
 
         <ion-list> 
 
          <ion-item *ngFor="let sideDish of dmenus.menuSide"> 
 
           <button ion-button clear (click)="openMenu(sideDish)">{{sideDish}}</button> 
 
          </ion-item> 
 
         </ion-list> 
 
         </ion-item>  
 
        </ion-item> 
 
        </ion-card-content> 
 
       </ion-card> 
 
       </ion-item> 
 
      </ion-list> 
 
      </ion-list> 
 
    </div> 
 
    </div>

イオン2文書は、静的なデータのみを持つ例があります。場合、私は喜んでいただければ幸いです誰かが私を助けることができました。

Answer 1

さて、ここで私はそれを回避しようとしています。私はselectedRestaurantIdx変数の値を変更する関数を使用しました。

changeMenus(index:number) 
{ 
    this.selectedRestaurantIdx=index; 
} 

ツールバー：

<ion-list *ngIf="restaurants!=undefined"> 
    <ion-item *ngFor="let menus of restaurants[selectedRestaurantIdx].restMenus"> (...) 

：私は、私が使用したい唯一の特定のレストランからの値を表示したい、その後

<ion-toolbar> 
    <ion-segment [(ngModel)]="selectedRestaurantIdx"> 
     <ion-segment-button (click)="changeMenus(i)" *ngFor="let restaus of restaurants; let i = index" [value]="i"> 
      {{restaus.restName}} 
     </ion-segment-button> 
    </ion-segment> 

そして、