Как я могу получить динамические данные из события (щелчка) на Angular

Вот мой компонент, в котором я загружаю идентификатор видео в тег i при событии щелчка. Я хочу получить доступ к этому идентификатору из файла video.component.ts. И хотите динамически загружать новое видео. Не могу понять, как его загрузить.

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