angular - 无法读取未定义视频的属性“elem”

Question

我videogular在我的 Angular 项目中使用库。我有这个错误Cannot read property 'elem' of undefined

我该如何解决？怎么了？

player.component.html

<div id="player" *ngIf="playData">

  <vg-player (onPlayerReady)="onPlayerReady($event)">

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

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

      <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-time-display vgProperty="left" vgFormat="mm:ss"></vg-time-display>

      <vg-quality-selector *ngIf="bitrates"
                           (onBitrateChange)="setBitrate($event)"
                           [bitrates]="bitrates">
      </vg-quality-selector>

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

      <vg-fullscreen *ngIf="playData.type == 1"></vg-fullscreen>
    </vg-controls>

    <video #media
           *ngIf="playData.type === 1"
           (onGetBitrates)="bitrates = $event"
           [vgMedia]="media"
           [vgHls]="playData.streamUrl"
           id="video"
           autoplay
           crossorigin>
    </video>

  </vg-player>

</div>

player.component.ts

export class PlayerComponent implements OnInit {

  @Input() playData: {
    type: number,
    streamUrl: string
  };

  @ViewChild(VgDASH) vgDash: VgDASH;
  @ViewChild(VgHLS) vgHls: VgHLS;

  api: VgAPI;
  data: any;

  bitrates: BitrateOption[];

  constructor() {
  }

  ngOnInit() {
    console.log(this.playData);
  }

  onPlayerReady(api: VgAPI) {
    console.log('onPlayerReady');
    this.api = api;

    if (this.playData.type === 1) {
      // set fullscreen as default
      if (this.api.fsAPI.isAvailable && !this.api.fsAPI.isFullscreen) {
        this.api.fsAPI.toggleFullscreen();
      }
    }

  }

  setBitrate(option: BitrateOption) {
    this.vgHls.setBitrate(option);
  }

}