I’m building out a simple color picker for a front end using typescript. I’m adding an event listener to the color picker input:
The html:
<input id="color-picker" type="color" value="" />
The typescript:
private grabUiElements() {
this.colorPicker = document.querySelector("#color-picker")
}
private addListners() {
this.colorPicker?.addEventListener("change", this.updateBrickColor.bind(this))
}
private updateBrickColor(changeEvent: Event) {
let hexColor = changeEvent?.target?.value // ! here's where the problem is
const red = hexColor & 0xFF
color >>= 8
const green = hexColor & 0xFF
color >>= 8
const blue = hexColor & 0xFF
doOtherStuff(red,green,blue)
}
The problem I’m running into is that the typescript compiler is telling me that the event target doesn’t have a value property, but it definitely does have it:
I double checked the input change event docs on MDN and they definitely have an example of just this:
https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/change_event#text_input_element
And I’m definitely using the dom Event interface:
So I’m not sure why I’m getting the error. I know I can use an any
for the parameter type, but I’d prefer to know what I’m doing wrong.
Ah, thanks for the quick replies in the comments.
I’m not sure how I was supposed to implement the other provided answer:
but casting suggested in the comments to the question worked fine:
I’m good to go, thanks again!
change it to
changeEvent: ChangeEvent<HTMLInputElement>
buy tadalafil pills – http://xtadalafilp.com/ purchasing tadalafil online
paper writing websites – http://boessay.com/ buy an essay online cheap
Yxzjhj – http://virviaga.com/ pharmacy viagra