videogular / videogular2

The HTML5 video player for Angular 2
https://videogular.github.io/videogular2-showroom/#/
MIT License
672 stars 211 forks source link

ERROR Cannot read property 'bufferDetected' of undefined and Cannot read property 'play' of undefined #839

Open elena-enacache opened 5 years ago

elena-enacache commented 5 years ago

Description

Sometimes when I want to play a video, I get these errors: ERROR Cannot read property 'bufferDetected' of undefined and Cannot read property 'play' of undefined.

This is my template:

<vg-player>
  <vg-overlay-play></vg-overlay-play>
  <vg-buffering></vg-buffering>

  <vg-scrub-bar>
    <vg-scrub-bar-current-time></vg-scrub-bar-current-time>
    <vg-scrub-bar-buffering-time></vg-scrub-bar-buffering-time>
  </vg-scrub-bar>

  <vg-controls>
    <vg-play-pause></vg-play-pause>

    <vg-time-display vgProperty="current" vgFormat="mm:ss"></vg-time-display>

    <vg-scrub-bar style="pointer-events: none;"></vg-scrub-bar>

    <vg-time-display vgProperty="total" vgFormat="mm:ss"></vg-time-display>

    <vg-mute></vg-mute>
    <vg-volume></vg-volume>

    <vg-fullscreen></vg-fullscreen>
  </vg-controls>

  <video [vgMedia]="media" #media id="singleVideo" preload="auto" [attr.data-asset-id]="id">
    <source [src]="src" type="video/mp4">
  </video>
</vg-player>

And this is my component:

import { Component, ElementRef, EventEmitter, Input, OnInit, Output, ViewChild } from '@angular/core';

@Component({
  selector: 'player',
  templateUrl: './player.template.html',
})
export class PlayerComponent implements OnInit {
  @Input() src: string;
  @Input() id: string;
  @ViewChild('media') media: ElementRef;
  @Output('videoElement') videoElement  = new EventEmitter<ElementRef>();
  constructor() { }

  ngOnInit() {
    this.videoElement.emit(this.media);
  }

}

I use angular 5 and "videogular2": "6.0.1".

Attachments

Image Title

image

Thanks!

r-rodriguez-s commented 4 years ago

I'm having this error a lot in my angular7 development and I don't know how fix it. Any solution? Even if I must insert a try / catch as a temporal solution would be appreciated.

Thanks !

NabaragRebaca commented 4 years ago

I am facing the same issue on angular-7 . Did you found any solution?

ghost commented 4 years ago

Hi! Even though my project is working I have been getting this console error. I noticed some comments in the code about changing/adding some types which might be a better way to address this long term. https://github.com/videogular/videogular2/pull/898 is a PR I put in. I verified that this works to supress the error by changing the compiled source in my node modules. If this PR is actually a bad idea, could someone lend some insight into what I might be doing wrong that would both a) not stop my project from working but b) still cause the error in the console?