javascript - type - use js in angular




Propriedade 'valor' não existe no tipo EventTarget no TypeScript (3)

Aqui está outra correção que funciona para mim:

(event.target as HTMLInputElement).value

Isso deve eliminar o erro informando ao TS que event.target é um HTMLInputElement , que inerentemente tem um value . Antes de especificar, o TS provavelmente sabia apenas que o event sozinho era um HTMLInputElement , portanto, de acordo com o TS, o target inserido era algum valor mapeado aleatoriamente que poderia ser qualquer coisa.

Portanto, o seguinte código está em Angular 4 e não consigo entender por que ele não funciona da maneira esperada.

Aqui está um trecho do meu manipulador:

onUpdatingServerName(event: Event) {
  console.log(event);
  this.newserverName = event.target.value; //this wont work
}

Elemento HTML:

<input type="text" class="form-control" (input)="onUpdatingServerName($event)">

O código me dá o erro:

Propriedade 'valor' não existe no tipo 'EventTarget'.

Mas, como pode ser visto no console.log esse valor existe no event.target .


Eu estava procurando uma solução para um erro similar ao TypeScript:

Propriedade 'dataset' não existe no tipo EventTarget no TypeScript

Eu queria chegar ao event.target.dataset de um elemento de botão clicado em Reagir:

<button
  onClick={onClickHandler}
  data-index="4"
  data-name="Foo Bar"
>
  Delete Candidate
</button>

Aqui está como consegui obter o valor do dataset "existente" via TypeScript:

const onClickHandler = (event: React.MouseEvent<HTMLButtonElement>) => {
  const { name, index } = (event.target as HTMLButtonElement).dataset
  console.log({ name, index })
  // do stuff with name and index…
}

event.target aqui é um HTMLElement que é o pai de todos os elementos HTML, mas não é garantido que tenha o value da propriedade. O TypeScript detecta isso e lança o erro. Elenco event.target para o elemento HTML apropriado para garantir que seja HTMLInputElement que tenha uma propriedade de value :

(<HTMLInputElement>event.target).value

Pela documentação :

Digite o $event

O exemplo acima lança o $event como any tipo. Isso simplifica o código a um custo. Não há informações de tipo que possam revelar propriedades do objeto de evento e evitar erros bobos.

[...]

O $event agora é um KeyboardEvent específico. Nem todos os elementos têm uma propriedade de value , por isso, ele target para um elemento de entrada.

(Ênfase minha)







typescript