2つの選択された値を取得し、表示にボタンに移動

Question

2つの選択リストから選択した値を取得し、ユーザーがボタンを押した後にアレイから画像を表示する最も良い方法は何ですか？出来ますか？

<ion-list> 
    <ion-item> 
    <ion-label>Gaming</ion-label> 
    <ion-select [(ngModel)]="gaming1" (ionChange)='valuechange(gaming1)'> 
     <ion-option *ngFor="let item of allList" [value]="item.values">{{item.name}}</ion-option> 
    </ion-select> 
    </ion-item> 
    <ion-item> 
    <ion-label>Gaming</ion-label> 
    <ion-select [(ngModel)]="gaming2"> 
     <ng-container *ngFor="let item of allList"> 
     <ion-option [value]="item.values" *ngIf="item.flag==0">{{item.name}}</ion-option> 
     </ng-container> 
    </ion-select> 
    </ion-item> 
</ion-list> 

<button ion-button block (click)="getData(gaming1 + gaming2)">Pass Data</button> 

コンポーネント.TSファイルは、私はボタンその作業のための機能をテストしたが、私はhtmlファイルに戻す画像を表示する方法を知らない：

public allList: any; 
     public endPlaces: any; 

     constructor(public navCtrl: NavController){ 

     this.allList=[{ 
      name:'NES', 
      values:'nes', 
      flag:0 
     },{ 
      name:'Nintendo64', 
      values:'n64', 
      flag:0 
     },{ 
      name:'PlayStation', 
      values:'ps', 
      flag:0 
     }]; 

     this.endPlaces=[{ 
      name:'Dota', 
      values:'nesn64', 
      image:'assests/img/dotajpg' 
     },{ 
      name:'CSGO', 
      values:'nesps', 
      image:'assets/img/csgo.jpg' 
     },{ 
      name:'Overwatch', 
      values:'nes', 
      image:'assets/img/overwatch.jpg' 
     }] 

     } 

     valuechange(key){ 

      for(let i = 0 ; i < this.allList.length ; i++){ 
      if(this.allList[i].values==key){ 
       this.allList[i].flag=1; 
      }else{ 
       this.allList[i].flag=0; 
      } 
      } 

     } 

     getData(selectedValue){ 

     for(let i = 0 ; i < this.endPlaces.length ; i++){ 
     if(this.endPlaces[i].values==selectedValue){ 
      console.log("Selected", this.endPlaces[i].name); 
     }else{ 
      console.log("dangggg"); 
     } 
     } 
     } 
    } 

更新：Console Log

ありがとうございました先進的で

Answer 1

コントローラにカンマ区切りのパラメータを渡す必要があります。

<!--In HTML file--> 
     <img src="{{matchEndPlace.image}}"> 
     <button ion-button block (click)="getData(gaming1, gaming2)">Pass Data</button> 


//in TS file 
matchEndPlace: any = {}; 
getData(gaming1, gaming2){ 
    let matchString = gaming1.toLowerCase() + gaming2.toLowerCase(); 
    this.matchEndPlace = this.endPlaces.find(e => e.values === matchString) || {}; 
} 

this.endPlaces=[{ 
      name:'Dota', 
      values:'nesn64', 
      image:'./assests/img/dotajpg' 
     },{ 
      name:'CSGO', 
      values:'nesps', 
      image:'./assets/img/csgo.jpg' 
     },{ 
      name:'Overwatch', 
      values:'nes', 
      image:'./assets/img/overwatch.jpg' 
     }]