This repository was archived by the owner on Nov 4, 2021. It is now read-only.
Folders and files
| Name | Name | Last commit date | ||
|---|---|---|---|---|
An Angular 6.x video player component based on DPlayer.
npm install angular-dplayer --savestyle.css
@import "~dplayer/dist/DPlayer.min.css";app.module.ts
import { DPlayerModule } from 'angular-dplayer';
@NgModule({
imports: [
// DPlayerModule // Or
DPlayerModule.forRoot({ // Global config
autoplay: true // All player can autoplay by default
})
]
})app.component.ts
import { Component } from '@angular/core';
import { DPlayerService } from 'angular-dplayer';
@Component({
selector: 'app-root',
template: `<d-player preload="auto" [video]="{url: 'http://example.com/video.mp4'}" [(volume)]="volume" (resize)="onResize()"></d-player>`
})
export class AppComponent {
constructor(
private DPService: DPlayerService
) {
}
onResize() {
console.log('resize');
}
}<d-player src="http://example.com/video.webm" poster="http://example.com/poster.jpg"></d-player>
enable hls or dash suppot by directive
<d-player dpHls [video]="{url: 'http://example.com/video.m3u8'}"></d-player>
FLV Live Stream
<d-player dpFlv [live]="true" [video]="{url: 'http://example.com/video.flv'}"></d-player>
control video status
import { Component } from '@angular/core';
import { DPlayerService } from 'angular-dplayer';
@Component({
selector: 'app-root',
template: `<d-player #player [video]="{url: 'http://example.com/video.mp4'}" (resize)="onResize(player)"></d-player>`
})
export class AppComponent {
constructor(
private DPService: DPlayerService
) {
}
onResize(player) {
player.pause();
}
}This content is released under the MIT License.