如何从 Angular 上的（单击）事件中获取动态数据

Question

这是我的组件，我在点击事件的i 标记中加载视频ID。我想从video.component.ts 文件中访问这个ID。并希望动态加载新视频。我不知道如何加载它。

<li *ngFor="let video of chapter.video" 
    class="list-group-item hoverEffect">
     <a 
     routerLink="video/{{ video.ytd }}" class="linkHover">
     <i 
     (click)="loadVideo({{ video.id }})" class="fa fa-play-circle float-right"></i>
                      {{ video.title }}
     </a>
</li>

这是我的ts 文件中的函数

  loadVideo(video: any){
    this.player = video;
  }

Answer 1

删除插值：

<li *ngFor="let video of chapter.video" 
    class="list-group-item hoverEffect">
     <a 
     routerLink="video/{{ video.ytd }}" class="linkHover">
     <i 
     ̶(̶c̶l̶i̶c̶k̶)̶=̶"̶l̶o̶a̶d̶V̶i̶d̶e̶o̶(̶{̶{̶ ̶v̶i̶d̶e̶o̶.̶i̶d̶ ̶}̶}̶)̶"̶ ̶c̶l̶a̶s̶s̶=̶"̶f̶a̶ ̶f̶a̶-̶p̶l̶a̶y̶-̶c̶i̶r̶c̶l̶e̶ ̶f̶l̶o̶a̶t̶-̶r̶i̶g̶h̶t̶"̶
     (click)="loadVideo(video.id)" class="fa fa-play-circle float-right">
     </i>
                      {{ video.title }}
     </a>
</li>