如何將 $event object 從我的模板傳遞到 Angular 上的組件？

Question

我想簡要了解一下事件綁定。

• 如何將事件 object 從模板傳遞到 angular 組件，而不僅僅是像這樣的方法

    <button (click)="onClick($event)">click me</button>

但也像 object 一樣<button (click)="onClickObject">click me</button>

• 我想知道在單擊按鈕后是否可以訪問像 javascript 這樣的組件內部的 DOM 對象，比如document.get.elementById('anyId')並操作它們
• 我想知道如何將事件 object 傳遞給服務 class
• 最后如何解決我的課程代碼中的這些錯誤。

import { Component, OnInit } from '@angular/core';
import { CoursesService } from '../courses.service';

@Component({
  selector: 'app-courses',
  template:`
  <h1 id="h1id">{{ greeting }}</h1>
  <button (click)="onClick($event)">click me</button>
  `,
  styleUrls: ['./courses.component.css']
})
export class CoursesComponent implements OnInit {

greeting ="";

onClick(event){
this.greeting = "hi my name is ..."
console.log(event)
}
constructor(){
  }
  ngOnInit(): void {
  }
  }

我收到 *Compiled with questions:X 錯誤

錯誤

src/app/courses/courses.component.ts:18:9 - 錯誤 TS7006：參數“事件”隱含地具有“任何”類型。

18 onClick(事件){*

• 我正在使用 ** Angular CLI：13.0.3 節點：14.15.5 Package 經理：npm 6.14.11在此處輸入圖像描述：win3264 **

Answer 1

在新版本的 Angular 中，我們需要傳遞聲明 function 的任何類內組件的參數類型。

<button (click)="onClick($event)">Greet for Employee</button>

這是模板的代碼。

onClick(event: any){ console.log(event); this.greeting="Welcome Chetan"; }

這是一個代碼類組件。 在這里，當我聲明 function onClick 時，我將事件視為任何類型的參數。 試試這個。