How to perform button click on custom panel

i started with

npx @grafana/toolkit plugin:create my-plugin

i was able to deploy this and see my changes.

All i want to do right now is to perform a button click.

on my module.html i put

<button class="btn navbar-button" (click)="onClickMe()">Click me!</button>

on module.ts i put:

onClickMe() {
    console.log('You are my hero!');

but this never gets called. No errors. No nothing.

Can you please guide me how to do this?

i was using the Angular template.

as i found out Grafana seems to prefer React.

So i switched to React an got it working:

Here is the complete code for SimplePanel.tsx

import React, { PureComponent } from 'react';
import { PanelProps } from '@grafana/data';
import { SimpleOptions } from 'types';
interface Props extends PanelProps<SimpleOptions> {}
export class SimplePanel extends PureComponent<Props> {
  render() {
    const { options, data, width, height } = this.props;
    return (
          position: 'relative',
          <div>Count: {data.series.length}</div>
          <button className="btn navbar-button" onClick={this.onClickMe}>Click me!</button>
  onClickMe() {
    console.log('The link was clicked.');