How to include JW Player in Nativescript with Angular?

0
votes

I am using NativeScript with Angular. I want to add JW Player in app to play video for my app but I cannot figure it out. My code is like below:-

home.html

<GridLayout row="0" #jwVideoPlayer>               
</GridLayout>

home.ts

import { Component, OnInit, ViewChild, ElementRef } from "@angular/core";
declare var jwplayer: any;

@Component({ 
    selector: "home", 
    templateUrl: "./home.component.html",    
})

export class HomeComponent implements OnInit {
   @ViewChild('jwVideoPlayer', { static: false }) jwVideoPlayer: ElementRef;

   ngOnInit() {
     const playerJw = jwplayer('jwVideoPlayer').setup({
            title: 'Player Test',
            playlist: 'https://cdn.jwplayer.com/v2/media/8L4m9FJB',
            width: 640,
            height: 360,
            aspectratio: '16:9',
            mute: false,
            autostart: true,
            primary: 'html5',
        });
   }
}

I am getting below error for obvious reason as I could not figure out the way to include JW Player in NativeScript:-

ERROR ReferenceError: Can't find variable: jwplayer

In web project I generally used below line to include JW Player.

<script type="text/javascript">jwplayer.key="1D+blahblah/blahblah=="</script>

Do Nativescript support JW Player?

Can anyone please help me as how to include JW Player in NativeScript app?

1
html5-videonativescriptjwplayernativescript-angular

1 Answers

0
votes

You can use the nativescript-jwplayer-web plugin with the following command

npm i nativescript-jwplayer-web --save