下面是指定event.target的另一种方法:

import { Component, EventEmitter, Output } from '@angular/core'; @Component({ selector: 'text-editor', template: `<textarea (keyup)="emitWordCount($event)"></textarea>` }) export class TextEditorComponent { @Output() countUpdate = new EventEmitter<number>(); emitWordCount({ target = {} as HTMLTextAreaElement }) { // <- right there this.countUpdate.emit( // using it directly without `event` (target.value.match(/\S+/g) || []).length); } }

对于那些在angular 13中遇到这个错误的人，因为是从以前的版本升级的

对我来说，问题是我在我的HTML中使用以下内容(这在以前是允许的)

(keyup)="applyFilter($event.target.value)" 

解决方法是:

HTML:

(keyup)="applyFilter($event)"

组件-在我调用的函数中:

applyFilter(event: Event) {
    const filterValue = (event.target as HTMLInputElement).value;
    // ... etc...
}

现在我可以像以前一样使用filterValue。

心理图像11 +。

tsconfig开放。禁用strictTemplates。

 "angularCompilerOptions": {
    ....
    ........
    "strictTemplates": false
  }

你需要显式地告诉TypeScript你的目标HTMLElement的类型。

方法是使用泛型类型将其转换为合适的类型:

this.countUpdate.emit((<HTMLTextAreaElement>e.target).value./*...*/)

或者(随你)

this.countUpdate.emit((e.target as HTMLTextAreaElement).value./*...*/)

或者(还是偏好问题)

const target = e.target as HTMLTextAreaElement;

this.countUpdate.emit(target.value./*...*/)

这将让TypeScript知道元素是一个文本区域，它将知道value属性。

同样的事情也可以用在任何HTML元素上，只要你给TypeScript更多关于它们类型的信息，它就会给你适当的提示，当然错误也会更少。

为了便于以后使用，你可以直接用目标的类型定义一个事件:

// create a new type HTMLElementEvent that has a target of type you pass
// type T must be a HTMLElement (e.g. HTMLTextAreaElement extends HTMLElement)
type HTMLElementEvent<T extends HTMLElement> = Event & {
  target: T; 
  // probably you might want to add the currentTarget as well
  // currentTarget: T;
}

// use it instead of Event
let e: HTMLElementEvent<HTMLTextAreaElement>;

console.log(e.target.value);

// or in the context of the given example
emitWordCount(e: HTMLElementEvent<HTMLTextAreaElement>) {
  this.countUpdate.emit(e.target.value);
}

我也遇到过类似的问题，我是这样解决的。通过使用这个自定义泛型类型

export type DatasetInjector<T, D extends DOMStringMap> = T & {
  dataset: D;
};

它是如何工作的?

在DatasetInjector中，泛型T指定HTML typescript类型，例如htmllinputelement或HTMLTextAreaElement。第二个泛型D用于提供关于输入标记(或任何其他HTML标记)的数据属性的缺失信息。

例子

这里我们为HTMLInputElement添加了数据属性inputId

// Now this can be used as funciton type for onChange handler for input element
// ChangeEventHandler<DatasetInjector<HTMLInputElement, { inputId: string }>>

export type DatasetInjector<HTMLInputElement, D extends DOMStringMap> = HTMLInputElement & {
  dataset: D; // D -> { inputId: string }
};

要了解更多信息，请参阅我的文章参考链接

考虑任何美元()

<textarea (keyup)="emitWordCount($any($event))"></textarea>