Как импортировать видео js -смещение - PullRequest
Новая
       6

Как импортировать видео js -смещение

0 голосов
/ 12 марта 2020

У меня есть следующий компонент 

import {
  Component,
  ElementRef,
  AfterViewInit,
  ViewChild,
  Input,
  EventEmitter,
  Output
} from '@angular/core';
import * as videojs from 'video.js';
import * as hls from 'videojs-contrib-hls';

require('videojs-offset');

export type VideoPlayerEvent = 'play' | 'pause' | 'ended';

@Component({
  selector: 'app-video-player',
  templateUrl: './video-player.component.html',
  styleUrls: ['./video-player.component.css']
})
export class VideoPlayerComponent implements AfterViewInit {
  @ViewChild('videoPlayer', { static: false })
  videoPlayer: ElementRef;

  @Input()
  videoUrl: string;

  @Input()
  videoType: string;
  /** Subject that emits when the component has been destroyed. */

  @Input()
  clipIn: string;

  @Input()
  clipOut: string;

  @Output()
  onPlayerEvent = new EventEmitter<VideoPlayerEvent>();
  videoJsPlayer: videojs.Player;
  constructor() { }
  ngAfterViewInit() {
    if (this.videoUrl) {
      const self = this;
      this.videoJsPlayer = videojs(this.videoPlayer.nativeElement, {}, function () {
        this.on('play', () => self.onPlayerEvent.emit('play'));

        this.on('pause', () => self.onPlayerEvent.emit('pause'));

        this.on('ended', () => self.onPlayerEvent.emit('ended'));
        return hls;
      });
      if(this.clipIn && this.clipOut) {
        this.videoJsPlayer.offset({
          start: this.clipIn,
          end: this.clipOut,
          restart_beginning: false
        });
      }
    }
  }
}

Я пытаюсь использовать библиотеку смещения видео js для потоковой передачи части потока HLS, продиктованного clipIn и clipOut

Я получаю следующую ошибку при компиляции 

ERROR in ../../libs/reusable-ui/video-player/src/lib/components/video-player.component.ts:55:28 - error TS2339: Property 'offset' does not exist on type 'Player'.

Я предполагаю, что это из-за того, что я неправильно импортировал библиотеку, что странно, так как состояние документа ее импортирует как таковой 

require('videojs-offset');

Кто-нибудь сможет сказать мне, что мне здесь не хватает?

1 Ответ

0 голосов
/ 12 марта 2020

По этому поводу на Github закрыт вопрос. Автор предлагает следующее:

Добавьте его в angular.json: 

"scripts": [
   "node_modules/video.js/dist/video.js",
   "node_modules/videojs-offset/dist/videojs-offset.js"
]

Удалите require('videojs-offset'); и используйте глобально как window['videojs'].

Подробнее здесь https://github.com/cladera/videojs-offset/issues/38

...