如何使用 videogular2 在 angular 中默认全屏制作视频？

Question

我目前正在处理 angular 项目，制作一个观看视频的网站。我使用 Videogular 是一个开发视频应用程序的框架。我不知道如何默认全屏制作视频。

我的代码：

<vg-player (onPlayerReady)="onPlayerReady($event)" >
  <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-playback-button></vg-playback-button>
  </vg-controls>
  <h1>{{id}}</h1>
  <video [vgMedia]="media" #media id="singleVideo" preload="auto" crossorigin>
    <source src="assets/skill/skill_{{id}}.mp4" type="video/mp4">
  </video>


</vg-player>

import { Component, OnInit } from '@angular/core';
import {ActivatedRoute} from '@angular/router';
import {VgAPI} from 'videogular2/compiled/src/core/services/vg-api';

@Component({
  selector: 'app-skill',
  templateUrl: './skill.component.html',
  styleUrls: ['./skill.component.css']
})
export class SkillComponent implements OnInit {
  id: string;
  constructor(private route: ActivatedRoute) {
    route.params.subscribe(params => {
        this.id = params['id'];
    });
  }

  ngOnInit() {
  }

  onPlayerReady(vgAPI: VgAPI) {
    vgAPI.play();
    vgAPI.fsAPI.toggleFullscreen();
  }
}

非常感谢！

Answer 1

http://www.videogular.com/tutorials/videogular-api/

我在 Videogular 的 API 文档中找到了触发全屏的方法：

toggleFullScreen(): Toggles between fullscreen and normal mode.

你试过了吗？

如何使用 videogular2 在 angular 中默认全屏制作视频？

How to make video by default in full screen in angular with videogular2?

angular

video

videogular2