Neutrinos Peludos Magnéticos

    another-ng-youtube-player
    TypeScript icon, indicating that this package has built-in type declarations

    0.0.6 • Public • Published

    Another Angular Youtube Player

    Installation

    npm i another-ng-youtube-player

    Supported API

    Currently supported attributes:

    Inputs

    • height (number) - optional height for the player
    • width (number) - optional width for the player
    • videoId (string) - will load the specified video by id

    outputs

    • ready (YT.Player) - implements youtube's player onReady event -> sends a the new created yt player instance
    • change - a state change event channeling the youtube's player instance state event object

    DEMO

    A Live Demo In Plnkr

    Usage

    First, import the YoutubePlayerModule to your module:

    import { NgModule } from '@angular/core';
    import { BrowserModule } from '@angular/platform-browser';
    import { YoutubePlayerModule } from 'another-ng-youtube-player';
    import { platformBrowserDynamic } from '@angular/platform-browser-dynamic';
    import { AppComponent } from './app';
     
    @NgModule({
      imports:[ BrowserModule, YoutubePlayerModule ],
      declarations: [ AppComponent, ],
      bootstrap: [ AppComponent ]
    })
    export class AppModule { }
     
    platformBrowserDynamic().bootstrapModule(AppModule);

    Next, use the youtube-player component. A Unique Id will be created for this player's instance:

    import { Component } from '@angular/core';
     
    @Component({
        selector: 'app',
        template: `
            <youtube-player
          [videoId]="id"
          (ready)="savePlayer($event)"
          (change)="onStateChange($event)"
        ></youtube-player>
        `
    })
    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);
      }
    }

    Keywords

    none

    Install

    npm i another-ng-youtube-player

    DownloadsWeekly Downloads

    8

    Version

    0.0.6

    License

    MIT

    Last publish

    Collaborators

    • tommyldunn