我在Angular 2组件代码中使用的是TypeScript Version 2。

我得到错误“属性“值”不存在类型“EventTarget”下面的代码,什么可能是解决方案。谢谢!

e.target.value.match(/\S+/g) || []).length

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(e: Event) {
    this.countUpdate.emit(
            (e.target.value.match(/\S+/g) || []).length);
  }
}

当前回答

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

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>

角10 +

tsconfig开放。禁用strictDomEventTypes。

  "angularCompilerOptions": {
    ....
    ........
    "strictDomEventTypes": false
  }
fromEvent<KeyboardEvent>(document.querySelector('#searcha') as HTMLInputElement , 'keyup')
    .pipe(
      debounceTime(500),
      distinctUntilChanged(),
      map(e  => {
            return e.target['value']; // <-- target does not exist on {}
        })
    ).subscribe(k => console.log(k));

也许上面的方法会有所帮助。 根据实际代码更改它。 问题是........目标(“价值”)

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

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 }
};

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

就我而言,我有:

const handleOnChange = (e: ChangeEvent) => {
  doSomething(e.target.value);
}

问题是我没有提供一个类型参数给ChangeEvent,这样它就知道e.target是一个HTMLInputElement。即使我手动告诉它target是一个输入元素(例如const target: HTMLInputElement = e.t target), ChangeEvent仍然不知道这是有意义的。

解决办法是:

// add type argument
const handleOnChange = (e: ChangeEvent<HTMLInputElement>) => {
  doSomething(e.target.value);
}