Open xinthose opened 2 years ago
I was able to get it to work with a *ngIf
as suggested here. Is this still the preferred way to show one video asynchronously?
<div *ngIf="panelOverviewVideo.length">
<vg-player>
<vg-overlay-play></vg-overlay-play>
<vg-buffering></vg-buffering>
<vg-scrub-bar>
<vg-scrub-bar-current-time></vg-scrub-bar-current-time>
<vg-scrub-bar-buffering-time></vg-scrub-bar-buffering-time>
</vg-scrub-bar>
<vg-controls>
<vg-play-pause></vg-play-pause>
<vg-playback-button></vg-playback-button>
<vg-time-display vgProperty="current" vgFormat="mm:ss"></vg-time-display>
<vg-scrub-bar style="pointer-events: none;"></vg-scrub-bar>
<vg-time-display vgProperty="left" vgFormat="mm:ss"></vg-time-display>
<vg-time-display vgProperty="total" vgFormat="mm:ss"></vg-time-display>
<vg-track-selector></vg-track-selector>
<vg-mute></vg-mute>
<vg-volume></vg-volume>
<vg-fullscreen></vg-fullscreen>
</vg-controls>
<video [vgMedia]="media" #media id="singleVideo" preload="auto" crossorigin>
<source src="{{panelOverviewVideo}}" type="video/mp4">
</video>
</vg-player>
</div>
<div *ngIf="!panelOverviewVideo.length">
<p>Not available</p>
</div>
Facing the same issue on using videogular. Setting the src dynamically using property of an object. When the object is reassigned, and property of that object has also been changed, it still doesn't change / reflect in the video.
Hence even though the user has selected a new title, the previous video continues playing.
<vg-player style="max-height:300px; max-width:380px; margin-bottom: 10px; padding:5px;"
*ngIf="rec_type == 'video'">
<vg-overlay-play></vg-overlay-play>
<vg-buffering></vg-buffering>
<vg-scrub-bar>
<vg-scrub-bar-current-time></vg-scrub-bar-current-time>
<vg-scrub-bar-buffering-time></vg-scrub-bar-buffering-time>
</vg-scrub-bar>
<vg-controls>
<vg-play-pause></vg-play-pause>
<vg-playback-button></vg-playback-button>
<vg-time-display vgProperty="current" vgFormat="mm:ss"></vg-time-display>
<vg-track-selector></vg-track-selector>
<vg-mute></vg-mute>
<vg-volume [fxHide.xs]=true [fxHide.sm]=true></vg-volume>
<vg-fullscreen></vg-fullscreen>
</vg-controls>
<video [vgMedia]="$any(media)" preload="auto" crossorigin>
<source [src]=rec_url type="video/mp4">
</video>
</vg-player>
I have the same issue where i am using vghls and when i change sources i get a file not found. The file is found if it is the first one selected but any source on the second selection is always not found?
<video #media #vgHls="vgHls" [vgMedia]="$any(media)" [vgHls]="currentSource" id="player" crossorigin>
Description
I load
src
asynchronously from a function in my component. When I setpanelOverviewVideoURL
to the correct URL, my video does not get the update, it just stays on a black screen and will never play. It does work if I hard code thesrc
URL. Do I need to call a method fromVgApiService
to get the player to reload once it has thesrc
?Expected Behavior
src
is set after component loads and it correctly loads the video