I need to sanitize multiple URLs from an array containing links to video sites e.g.:
videos: SafeResourceUrl = ['www.someURL1', 'www.someURL2',...
];
To achieve this, I created a constructor like so:
constructor(private sanitizer: DomSanitizer) {
this.videos[this.trackByMethod(this.count)] = sanitizer.bypassSecurityTrustResourceUrl(this.videos[this.count]);
}
In order to determine the position in the array, I implemented a method that retrieves the current index from the template:
trackByMethod(index: number): number {
return this.count = index;
}
This is how my template is structured:
<div class="videos" align="center" *ngFor="let vid of videos; let i = index" [attr.data-index]="i" (ondrag)="trackByMethod(i)">
<iframe [src] = "vid" style='min-width: 30%; height: 315px' allowfullscreen>
</iframe>
</div>
The issue I'm facing is that I am unable to retrieve the index from the template. The method trackByMethod with event binding
(ondrag)="trackByMethod(i)"Could anyone offer assistance? Thank you!