Cannot read property 'nativeElement' of undefined angular

Question

in template

<audio
  id="audioElement"
  src="https://mp3uk.net/mp3/files/millie-b-m-to-the-b-mp3.mp3"
  (timeupdate)="timeupdated($event)"
>
  Your browser does not support the <code>audio</code> element.
</audio>

in component

@ViewChild('audioElement') audioEl: ElementRef;
     play() {
        console.log(this.audioEl);
        this.playButton.nativeElement.classList.add('paused');
    }

but, in console:

 undefined
 ERROR TypeError: Cannot read property 'nativeElement' of undefined

What am I doing wrong?

Answer 1

use #audioElement for ViewChild, not id = 'audioElement'