HTML5 Download Attribute with TypeScript and Angular 9
In this post we will give you information about HTML5 Download Attribute with TypeScript and Angular 9. Hear we will give you detail about HTML5 Download Attribute with TypeScript and Angular 9And how to use it also give you demo for it if it is necessary.
In this article, we’ll learn by example what’s the HTML
download attribute and we’ll see how to use it with TypeScript and Angular 9/8 by example for downloading files from a server or REST API endpoint.
HTML 5 provides many features that are less known by developers but can be useful for quickly solving common development problems.
See also how to upload forms with FormData and TypeScript.
What’s the Download Attribute in HTML 5?
One of these HTML 5 features is the download attribute which enables developers to use a different file download name other than the name in the URL and even force the downloading of a file by the browser which was only possible via server code before that.
download attribute allows you to instruct the web browser to download the resource specified as the value of the
href attribute. And also use a default file name for the downloaded resource.
Note: The download attribute is restricted by the same origin policy.
The HTML Download Attribute by Example
If you have implemented file downloading before using server-side methods such as the
Content-Disposition header which is used for specifying the default file name in the browser’s Save As dialog.
The download attribute which is introduced in HTML 5 can be used for:
- Downloading a resource instead of navigating to the resource,
- Providing a default file name for the downloaded resource.
Let’s see an example of the download attribute.
We use the attribute with anchor tags, for example:
When the user triggers the download link, the file will be downloaded with the filename in the download attribute.
This attribute can be useful when the generated file names are used in the server-side so the download attribute enables the file name to be meaningful to users.
Note: For older web browsers such as Internet Explorer, the
downloadattribute may not be available. In this cas, you can open the downloaded resource in a new browser tab/window with the
targetattribute set to
The Download Attribute in Angular by Example
You can bind the
download attributes in Angular to set the URL and filename dynamically as follows:
Hope this code and post will helped you for implement HTML5 Download Attribute with TypeScript and Angular 9. if you need any help or any feedback give it in comment section or you have good idea about this post you can give it comment section. Your comment will help us for help you more and improve us. we will give you this type of more interesting post in featured also so, For more interesting post and code Keep reading our blogs