Cannot change the source of loaded player

[Seekeer]

I have defined player like that in Angular App:

<vm-player (vmPlaybackEnded)="videoEnded()" #player >
  <vm-video cross-origin="true" >
    <source src="{{videoURL}}" type="video/mp4" />
  </vm-video>

Everything is fine, inspite of the fact that when Im changing videoURL property - I couldnt make player to play video from new source. I got following HTML, where api/Files/getFileById?fileId=6177 is old video, which is still @playing, getRandomFileBySeriesId?seriesId=5 is a new one and this request is never called.

<source _ngcontent-loi-c159="" type="video/mp4" data-vs="http://192.168.1.55:51951/api/Files/getFileById?fileId=6177" src="http://192.168.1.55:51951/api/Files/getRandomFileBySeriesId?seriesId=5">

When I'm changing source this way in ordinary HTML

[jbjhjm]

I'm experiencing this issue too, however only since I migrated the project to angular 13 / Ivy. Will share here if I find something.

Edit: I have to correct myself. The issue is already present in our live built that still uses angular 11 + View Engine. I'm sure this was working fine earlier... but I cannot reproduce working state.

[jbjhjm]

Running these lines after src has been updated shows that the provider data actually changes:

player.getProvider().then(prov=>{
			console.log(prov)
		})

So for me this is a buggy behavior and should be fixed. I suspect that vime has issues with updated src attributes and expects the element to be fully replaced instead to trigger change handling. I'm right now trying to find a workaround to fix it temporarily.

[jbjhjm]

ALright, the only workaround that I was able to find is to remove and rebuild the whole vime component:

// ng template
`<vm-player *ngIf="url" #player playsinline >
	<vm-video cross-origin="true" #video>
		<source [src]="url" type="video/mp4" />
	</vm-video>
</vm-player>
`
class VideoPlayer {
  	loaded = false;
	url: string;

	@Input('url') set _url(url:string) {
		if(!this.loaded) {
			// assign url immediately on first assignment
			this.url = url;
			this.loaded = true; 
		} else {
			// set url to null to remove player through ngIf, 
			//then assign new url in next tick to create new vime instance
			this.url = null; 
			setTimeout(()=>{
				this.url = url;
			},1);
		}
	}

}

[Seekeer]

@jbjhjm Thanks, that worked!