how to create a validation to check image type in typescript

Question

can someone tell me how to create a method to check the image type?

I'm creating an image component in which only the following types will be accepted [JPEG GIF, including animated GIFs, PNG SVG,BMP]

Hi, can you explain more ? You are creating a component which does what exactly ? Thank you. — Ricardo Machado
– Ricardo Machado, Commented Oct 18, 2022 at 19:32

cc_haensel · Accepted Answer · 2022-10-18 19:51:57Z

1

I don't know how to do it in Angular, but in native JS you can get the file type as an attribute of the file object.

I think there will be something similar in Angular.

const onchange = (event) => {
    const filetype = event.target.files[0].type;
    console.log(filetype);
}

or more general:

const elem = document.getElementById('your-file-input');
console.log(elem.files[0].type);

This will log something like "image/png" or "application/pdf" which you then can check.

edited Oct 18, 2022 at 19:51

answered Oct 18, 2022 at 19:51

cc_haensel

1101 silver badge7 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

Rakesh · Accepted Answer · 2022-10-18 20:10:09Z

0

What I understood from the question that you need to accept only certain file types, you can easily do it in html as your input type will be file to accept a file so use accept attribute of input type file where you can pass the extensions you need to support. Refere w3school tutorials - https://www.w3schools.com/tags/att_input_accept.asp

<input type="file" id="img" name="img" accept="image/*">

answered Oct 18, 2022 at 20:10

Rakesh

113 bronze badges

Collectives™ on Stack Overflow

how to create a validation to check image type in typescript

2 Answers 2

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related