Im trying to make a menu image execute a js function to change it's properties by adding the active class to it. I am working with angular on stackblitz and I keep getting the Property 'openbtn' does not exist on type 'HeaderComponent' error. I am lost on what to do.

The js file is in angular.json like this: "scripts": ["src/app/header/assets/js/nav.js"]

The image which should execute the function:

<img
    src="https://myimage.png"
    width="32"
    alt="!"
    class="burger"
    id="burger"
    (click)="openbtn()"
  />

The function itself:

function openbtn() {
  document.getElementById('burger').onclick = function () {
    this.classList.toggle('active');
  };
}

header.component.ts file:

import { Component, OnInit } from '@angular/core';
declare function openbtn(): any;

@Component({
  selector: 'app-header',
  templateUrl: './header.component.html',
  styleUrls: ['./header.component.css'],
})
export class HeaderComponent implements OnInit {
  constructor() {}

  ngOnInit() {
    openbtn();
  }
}