Как остановить воспроизведение видео в фоновом режиме

Question

Я использую видео в своем проекте, но видео воспроизводится в фоновом режиме, когда я перехожу к другому компоненту. Эта проблема возникает только в ios, а не в Android

Html

<VideoPlayer
src="{{videoUrl}}"
height="300"></VideoPlayer>

угловая

  index:any
  videoUrl :any




  ngOnInit() {

    this.router.paramMap.subscribe(
      (response) =>{
        this.index = response.get('id')
        this.videoUrl=this.galleryService.getVideoById(this.index)
        console.log(response)

      }
    )    
  }

Это мой код.

Answer 1

Прослушайте navigatingFrom событие на вашей текущей странице и вызовите pause() метод на VideoPlayer.

HTML

<VideoPlayer #player
  src="{{videoUrl}}"
  height="300"></VideoPlayer>

TS

@ViewChild("player") player: ElementRef; 

constructor(private page: Page) { }

ngOnInit() {
   this.router.paramMap.subscribe(
     (response) => {
      this.index = response.get('id')
      this.videoUrl=this.galleryService.getVideoById(this.index)
      console.log(response)
   });
   this.page.on(Page.navigatingFromEvent, () => {
      this.player.nativeElement.pause();
   });
}

ngOnDestroy() {
 this.page.off(Page.navigatingFromEvent);
}

Вы также можете использовать Router Events на Angular, но вы можетедолжны отфильтровать соответствующий маршрут.