videogular2
videogular2 copied to clipboard
Hi Jaime I am still getting these error to play a m3u8 file
Description
@IxquitilisSaid
I have install "@videogular/ngx-videogular": "^3.0.1",
and
"hls.js": "^0.14.17",
have add the hls.min.js file to The script in Angular.json file.
On my component.html I have :
<video
#media
#vgHls="vgHls"
width="1000"
height="800"
crossorigin
controls
[vgMedia]="media"
[vgHls]="
'http://demo.unified-streaming.com/video/tears-of-steel/tears-of-steel.ism/.m3u8'
"
id="singleVideo"
type="video/mp4"
></video>
My app.module.ts :
import { BrowserModule } from '@angular/platform-browser';
import { NgModule } from '@angular/core';
import { FormsModule } from '@angular/forms';
import { NgbModule } from '@ng-bootstrap/ng-bootstrap';
import { AppRoutingModule } from './app-routing.module';
import { BrowserAnimationsModule } from '@angular/platform-browser/animations';
import { VgCoreModule } from '@videogular/ngx-videogular/core';
import { VgControlsModule } from '@videogular/ngx-videogular/controls';
import { VgOverlayPlayModule } from '@videogular/ngx-videogular/overlay-play';
import { VgBufferingModule } from '@videogular/ngx-videogular/buffering';
import { VgStreamingModule } from '@videogular/ngx-videogular/streaming';
import { AppComponent } from './app.component';
import { CameraComponent } from './camera/camera.component';
import { NavbarComponent } from './navbar/navbar.component';
@NgModule({
declarations: [AppComponent, CameraComponent, NavbarComponent],
imports: [
BrowserModule,
AppRoutingModule,
FormsModule,
BrowserAnimationsModule,
NgbModule,
VgCoreModule,
VgControlsModule,
VgOverlayPlayModule,
VgBufferingModule,
VgStreamingModule,
],
providers: [],
bootstrap: [AppComponent],
})
export class AppModule {}
Expected Behavior
But still, can t play my file I have created a question on StackOverflow too please visit : https://stackoverflow.com/questions/65846501/how-to-play-m3u8-file-from-unified-streaming-on-ngx-videogular
Please help me make this run
Thanks
Please refer to this Dash & HLS example as a practical guide.
But without more context, I'm kinda in the dark here.
You said you installed HLS npm i --save hls.js
and imported it in your angular.json
file but could you please post the scripts
part of it?
Because if it's logging Hls is not defined
then it's probably one of these cases:
- Wrong path to
node_modules/hls.js/dist/hls.min.js
in yourangular.json
- You're initializing the video player before HLS being resolved/available
If none of that works, please let me know
Thank you @IxquitilisSaid I check them but they fine, Please have look at https://github.com/harry9345/angular.git whenever you have time for a headache.