이온 2 이온 세그먼트 ngFor 모델의 데이터

최근에 Ionic 2를 사용하기 시작했습니다. PWA의 페이지 중 하나는 다른 레스토랑의 주 메뉴에 대한 정보를 표시하기로되어 있습니다.이온 2 이온 세그먼트 ngFor 모델의 데이터

내가하려는 것은 각 레스토랑의 메뉴간에 내 페이지의 내용을 전환 할 수있는 버튼이있는 이온 세그먼트를 갖는 것입니다.

다음은 내 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>

이온이 문서 만 난 정말 아주 같은. 나는 기꺼이 경우 감사하겠습니다 않습니다 아무것도 찾을 수 정적 데이터와 예제를 가지고 누군가 나를 도울 수 있었어.

출처

2016-12-11 Joao Ventura

좋아, 그럼 여기에 내가 뭘 했어. 내 selectedRestaurantIdx 변수의 값을 변경하는 함수를 사용했습니다.

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

도구 모음 : 다음

<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>

그리고 내가 사용하는 거라고 하나의 특정 레스토랑에서 값을 표시하고 싶었 :

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

을

출처

2017-01-05 18:42:07

이온 2 이온 세그먼트 ngFor 모델의 데이터

답변

관련 문제