JSPM

  • ESM via JSPM
  • ES Module Entrypoint
  • Export Map
  • Keywords
  • License
  • Repository URL
  • TypeScript Types
  • README
  • Created
  • Published
  • Downloads 3
  • Score
    100M100P100Q36942F
  • License MIT

AngularJS directive for youtube-iframe-player-api

Package Exports

  • ng-youtube-embed-iframe

This package does not declare an exports field, so the exports above have been automatically detected and optimized by JSPM instead. If any package subpath is missing, it is recommended to post an issue to the original package (ng-youtube-embed-iframe) to support the "exports" field. If that is not possible, create a JSPM override to customize the exports field for this package.

Readme

ng-youtube-embed-iframe Build Status

ng-youtube-embed-iframe

ng-youtube-embed-iframe lets you embed a YouTube video player on your website and control the player using AngularJs.

Using ng-youtube-embed-iframe functions, you can queue videos for playback; play, pause, or stop those videos, adjust the player volume, or retrieve information about the video being played. You can also add event listeners that will execute in response to certain player events, such as a player state change or a video playback quality change.

An AngularJS directive for Youtube Iframe API. All functions supported by Youtube Iframe API is supported.

Getting started

Installation

Installation can be done via Package managers such as npm or yarn

npm install ng-youtube-embed-iframe --save
# or
yarn add ng-youtube-embed-iframe

or use cdn

Minified
//unpkg.com/ng-youtube-embed-iframe@latest/ng-youtube.min.js
Pretty Printed
//unpkg.com/ng-youtube-embed-iframe@latest/ng-youtube.js

Usage

<script src="../ng-youtube.min.js"></script>

var app = angular.module('myApp', ['ngYoutube'])

<youtube id="myYoutubePlayer"></youtube> // add in html

options

Options like video-id, height, width can be directly provided in the element which is considered as the main priority.

Other options can be provided in player-options

In HTML

<youtube player-options="options" id="myYoutubePlayer"></youtube>

In Controller

$scope.options = {
    videoId:'',
    height:'100%',
    width:'700px',
    playerVars:{} // all parameters supported by youtube-iframe-api
}

Refer wiki for documentation