call a function in angular 10 from a JavaScript function that resides in the same component ts file

Question

I have a button that opens a modal. I cannot use (click)="editAccessLevel()" as event for the button when it is using the data-toggle event.

<button class="dropdown-item" type="button"  id="accessID" data-toggle="modal" data-target="#editAdminModal" >Change Access Level</button>

I seen this example when Javascript function was defined in the html : but I have my function defined in the typescript. this example doesn't work.

 ngOnInit() 
 {
    this.resetForm();
    window['angularComponentReference'] = 
          {
            component: this, zone: this.ngZone, loadAngularFunction: () => this.editAccessLevel(),
          };
   $(document).on("click", "#accessID", function callGetAccessLevel() {
    window.angularComponentReference.zone.run(() => 
       { window.angularComponentReference.loadAngularFunction(); });
    });

}

All I need to know is how to call

 editAccessLevel()
   {
     this.showAccessLevel = true;
     alert("show access level features = " + this.showAccessLevel);
   }

from a JavaScript function in the ngOninit();

question from:https://stackoverflow.com/questions/66049794/call-a-function-in-angular-10-from-a-javascript-function-that-resides-in-the-sam

Answer 1

Waitting for answers