typescript - Pauza video în Javascript nu este o funcție

Așa că am o mică problemă cu videoclipurile, am un site web și acolo am același videoclip afișat pe 3 pagini diferite. Videoclipurile sunt toate puse pe pauză până când utilizatorul face clic pe ele pentru a începe. Problema este că, atunci când părăsesc o pagină și videoclipul este pur și simplu acolo, chiar dacă am dat click pe redare sau pauză sau nu am făcut nimic deloc, celelalte două îmi dau o eroare spunând că vid.pause nu este o funcție.

Aceasta este partea HTML ->

<video id="{{vid?.id}}" src={{vid?.video}} onloadedmetadata="this.paused = true; this.currentTime = 1" (click)="playPause(vid)"> </video>

Și js ->

  playPause(vid) {
    var vid = (<HTMLMediaElement>document.getElementById(vid.id));
    if (vid.paused == true) {
      vid.play();
    } else {
      vid.pause();
      vid.currentTime = 1;
    }
  }

Răspuns #1

Problema pentru mine era că am încercat să pun pe pauză un obiect jQuery, dar acest lucru nu este posibil. Trebuie să pui pe pauză un element DOM. Așadar, am corectat asta prin convertirea obiectului meu jQuery într-un element DOM.

ÎNAINTE:

$("#video").pause();

DUPĂ/REZOLVAT:

$("#video")[0].pause();

Răspunsul #2

ACTUALIZARE :

Un lucru de remarcat este:

Trebuie să treci proprietatea vid către element și apoi înapoi în .ts. Aceasta nu este o practică bună.

De asemenea, folosești variabilele în interiorul proprietăților într-un mod greșit.

Cea mai bună modalitate de a face acest lucru ar fi:

fișier .html

<video #myVideo [id]="vid?.id" [src]="vid?.video" onloadedmetadata="this.paused = true; this.currentTime = 1" (click)="playPause(myVideo)"> </video>

fișier .ts

playPause(vid: HTMLMediaElement) {
    if (vid.paused == true) {
      vid.play();
    } else {
      vid.pause();
      vid.currentTime = 1;
    }
  }

Bănuiala mea este că ai o diferență între fișierele tale HTML și JS.

În fișierul tău HTML, ai id-ul videoclipului ca vid.id. În fișierul tău JS, folosești getElementById, trecând id-ul ca vid.video.

Prin urmare, var vid va fi undefined și vid.pause() nu va fi o funcție.

Probabil trebuie să folosești var vid=(<HTMLMediaElement>document.getElementById(vid.id));