When the file is generated on a server or requires authentication, you must use a service to fetch the data as a Blob . Step 1: Create a Download Service
To download files in an Angular application, you typically need to fetch the file as a binary blob, create an object URL, and trigger a download through a hidden anchor element. While simple static files can be handled with standard HTML attributes, dynamic files—such as PDF reports or CSV exports from an API—require a service-based approach using Angular’s HttpClient . 1. The Simple Way: HTML5 Download Attribute
Download Report Download {{ fileName }} Use code with caution. 2. The Dynamic Way: Downloading via API
For static files located in your application's assets/ folder, you can use a standard anchor tag with the download attribute. This tells the browser to download the target instead of navigating to it.
The service uses HttpClient with responseType: 'blob' to ensure the response is treated as raw binary data.
