Sanitize url in angular example
Project: codever - File: backup-bookmarks-dialog.component.ts
Use the DomSanitizer and its method bypassSecurityTrustUrl as shown in the example below.
Thus, you don’t get the unsafe prefix in your generated html
export class BackupBookmarksDialogComponent implements OnInit {
backupType: string; // 'bookmarks' | 'snippets';
blobUrl: any;
sanitizedBlobUrl: any;
filename: string;
constructor(
private dialogRef: MatDialogRef<BackupBookmarksDialogComponent>,
private router: Router,
@Inject(MAT_DIALOG_DATA) data,
private sanitizer: DomSanitizer
) {
this.sanitizedBlobUrl = this.sanitizer.bypassSecurityTrustUrl(data.blobUrl);
this.blobUrl = data.blobUrl;
this.backupType = data.backupType;
const currentDate = new Date();
this.filename = `${this.backupType}_${currentDate.toISOString()}.json`;
}
In the html component the sanitizedBlogUrl is injected in the href attribute of the a html element
<a [href]="sanitizedBlobUrl" [download]="filename" type="button" class="btn btn-primary btn-sm mr-2" (click)="download()"><i class="fas fa-download"></i> Download
</a>
Reference - https://angular.io/api/platform-browser/DomSanitizer
Shared with from Codever.
👉 Use the Copy to mine
functionality to copy this snippet to your own personal collection and easy manage
your code snippets.
Codever is open source on Github ⭐🙏
