HTML Question
Using typescript, how to update HTML element's value and text.?
I want to update update certain attributes of html element using typescript. Is it possible, if Yes then how..? I'm providing my code.
HTML:-
<a ref="#" id="userProfileName" style="padding-top: 0px; padding-bottom: 0px; padding-right: 10px; padding-left: 10px;">
<img src="" alt="" id="userProfilePic" class="profile-img" style="width: 56px; height: 50px;"></a>
Typescript:-
document.getElementById('userProfilePic').src = profile.picture;
document.getElementById('userProfileName').textContent = profile.given_name;
Error I'm getting:-
error TS2339: Property 'src' does not exist on type 'HTMLElement'.
Recommended for you: Get network issues from WhatsUp Gold. Not end users.
Answer Source
The document.getElementById function returns an element of type HTMLElement which does not have the src property.
You need to type assert it to HTMLImageElement:
(document.getElementById('userProfilePic') as HTMLImageElement).src = profile.picture;
The same goes for the HTMLAnchorElement but textContent can be accessed straight from the HTMLElement so no need to cast.
Recommended from our users: Dynamic Network Monitoring from WhatsUp Gold from IPSwitch. Free Download