Is "click event on node" works with Mermaid js in angular?

I am trying to integrate Mermaid flowchart drawing Javascript in my angular 9 based client application. I am able to draw the flowchart diagram, but I do have requirement to provide click event on a particular node with function defined in Typescript (component file). Can someone please provide how to solve this issue with example?

Here is the code that I have html : <div #mermaid> TS:

@ViewChild('mermaid', { static: true }) mermaid: ElementRef;

ngAfterViewInit () {
mermaid.initialize(this.config);
const element: any = this.mermaid.nativeElement;
const graphDefinition = `graph TD\nA[Christmas] -->|Get money| B(Go shopping)\nB --> C(Let me think)\nC -->|One| D[Laptop]\nC -->|Two| E[iPhone]\nC -->|Three| F[fa:fa-car Car]\nA[Christmas] -->|Get money| D[Laptop]\nB --> E \nclick A CustomFunction`;

let _local = this;
var insertSvg = function(svgCode, bindFunctions){
element.innerHTML = svgCode;
bindFunctions(element);
};
var id = 'theGraph';
mermaid.render(id,graphDefinition,insertSvg, element);
}

CustomFunction = function() {
alert("Hello World");
};


Thanks,

Continue reading...