Angular 10中的Javascript函数无法工作

<!-- 错误的绑定方式 -->
<button>Click me</button>

<!-- 正确的绑定方式 -->
<button (click)="myFunction()">Click me</button>

export class MyComponent {
  myFunction() {
    console.log('Function called');
  }
}

export class MyComponent {
  myFunction(param: string): void {
    console.log('Function called with param:', param);
  }
}

import { Component } from '@angular/core';

@Component({
  selector: 'app-my-component',
  templateUrl: './my-component.component.html',
  styleUrls: ['./my-component.component.css']
})
export class MyComponent {
  // 组件代码
}

myFunction() {
  try {
    // 函数逻辑
  } catch (error) {
    console.error('Error in myFunction:', error);
  }
}

// my-component.component.ts
import { Component } from '@angular/core';

@Component({
  selector: 'app-my-component',
  templateUrl: './my-component.component.html',
  styleUrls: ['./my-component.component.css']
})
export class MyComponent {
  myFunction() {
    console.log('Function called');
  }
}

<!-- my-component.component.html -->
<button (click)="myFunction()">Click me</button>