(ngx) A youtube component wrapped with Angular (typescript)
MIT License
npm i ngx-youtube-player
This is an Angular component based on youtube player iframe api. This component came out as a result of the open source project Echoes Player - an alternative player for watching and listening to media from youtube.
Before < v17 | After >= v17.1.0 |
---|---|
YoutubePlayerModule.forRoot() |
as standalone version |
Starting with version 17.1.0, YoutubePlayerComponent
is a standalone component
Angular Youtube Component includes 2 optional licenses:
To purchase a license, please contact at https://orizens.com/contact
npm install ngx-youtube-player
Currently supported attributes:
First, import the YoutubePlayerModule to your module:
import { platformBrowserDynamic } from "@angular/platform-browser-dynamic";
import { AppComponent } from "./app";
bootstrapApplication(AppComponent);
Next, use the youtube-player component. A Unique Id will be created for this player's instance:
import { Component } from "@angular/core";
@Component({
standalone: true,
selector: "app",
template: `
<youtube-player
[videoId]="id"
(ready)="savePlayer($event)"
(change)="onStateChange($event)"
></youtube-player>
`,
imports: [YoutubePlayerComponent]
})
export class AppComponent {
player: YT.Player;
private id: string = "qDuKsiwS5xw";
savePlayer(player) {
this.player = player;
console.log("player instance", player);
}
onStateChange(event) {
console.log("player state", event.data);
}
}
To start developing tdd/bdd style: npm run dev
This will: compile ts files, watch for changes and start the test task. Whenever a ts file is changed, it will rerun the tests.