How to call a function on edit button in angular?

#angular #typescript #javascript

My project angular version:

Angular CLI: 9.0.0-rc.7

I m working with grid and I want to edit a record. and I call a function on edit Button then console.log is not display on the browser??

partymastercomponent.ts

import { Component, OnInit } from '@angular/core';
import { BackendService } from '../backend.service';

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

PartyMstId: any;
PartyCode: any;
PartyName: any;

partylist: any;

constructor(public myservice: BackendService) { }

columnDefs = [
  {
      headerName: "Edit",
      field: "icon",
      width: 100,
      //id: this.PartyMstId,
      cellRenderer: function (params)
      {
                    //return  '<button (click)="editfunction()"><i class="fa fa-edit"></i></button>' //when i press edit icon then console log not print
                     return '<button (click)="editfunction()" >ClickThis</button>' //when I press button then console.log is not display
      }
  },
  { headerName: 'PartyMstId', field: 'PartyMstId', sortable: true, filter: true/*, checkboxSelection: true*/ },
  { headerName: 'PartyCode', field: 'PartyCode', sortable: true, filter: true },
  { headerName: 'PartyName', field: 'PartyName', sortable: true, filter: true },

];

editfunction() {
console.log("call this edit function");
}
}

partymastercomponent.html

class="ag-theme-balham"
[rowData]="partylist"
rowSelection="multiple"
[columnDefs]="columnDefs">

how to call a function on edit button click??

icon as well as button is not working??

when I press write click on browser then

browser

please help?