Angular 如何向user-ionic3显示列表中带有图标的选定项目

Angular 如何向user-ionic3显示列表中带有图标的选定项目,angular,ionic3,Angular,Ionic3,我正在开发一个新的音乐应用程序。在我的项目中,我在home页面中列出了很多歌曲 所以,每当用户按下列表中的特定歌曲时,我想用一些图标突出显示该特定歌曲,并将其显示给用户 这里我分享我的代码 home.html {{track.artist}} {{track.title} -->[这是图标,我 希望在用户按特定歌曲时显示此图标] {{音轨?.artist}} -->[这是图标。I 想在用户按下特定歌曲时显示此图标吗?创建一个方法,比如说选择(),并在单击离子项时调用它 <ion-ite

我正在开发一个新的音乐应用程序。在我的项目中,我在
home
页面中列出了很多歌曲

所以,每当用户按下列表中的特定歌曲时,我想用一些图标突出显示该特定歌曲,并将其显示给用户

这里我分享我的代码

home.html


{{track.artist}}

{{track.title}

-->[这是图标,我 希望在用户按特定歌曲时显示此图标] {{音轨?.artist}}
-->[这是图标。I
想在用户按下特定歌曲时显示此图标吗?

创建一个方法,比如说选择(),并在单击离子项时调用它

<ion-item *ngFor="let track of myTracks" style="margin: 15px;margin-left: 0px; height: 61px;" (click)="select(track); currentTrack = track">

我得到以下错误-->在
主页
页面中找不到选中的项,无论
是否选中
。我尝试了
isSelected。但它不工作。我编辑了我的答案。所选项目应在构造函数外部和之前
<ion-item *ngFor="let track of myTracks" style="margin: 15px;margin-left: 0px; height: 61px;" (click)="select(track); currentTrack = track">
<ion-icon *ngIf="isSelected(track)" name="ios-musical-notes"></ion-icon>
itemSelected;

constructor(.....){

}

// called when you click the track
select(track){

   //if the track was selected already, unselect it; else select this track. 
   if(this.isSelected(track)){     
       this.itemSelected = null;    
   }else{
       this.itemSelected = track;
}

// check the selected track, if true then show icon
isSelected(track){
    return this.itemSelected === track; // the track that you selected
}