Issue
I am loading an image in a new window when user click a button in Angular.
The popup which I opened contains HTML.
Angular HTML:
<button class="btn btn-primary" type="button" (click)="openDocument(doc)"> View </button>
TS:
openDocument(doc) {
doc.uploadedDocUrl = "https://beta.lottoweaver.com/WeaverDoc/commonContent/www.nationallottery.co.za/playerDocument/408441_ID_PROOF_null_1616082462069.pdf"
let str = `<embed src=${doc.uploadedDocUrl} width='100%' height="100%">`;
this.OpenWindow = window.open('', '', 'width=900, height=600, left=200, top=100');
this.OpenWindow.document.write(`<body onload="checkIfPdf(${doc.uploadedDocUrl})">${str}</body>
<script>
function checkIfPdf(doc) {
if(doc.endsWith(".pdf")) {
console.log("is pdf")
} else {
console.log("is not pdf")
}
}
</script>
`);
this.OpenWindow.document.close();
}
I want keep width and height attributes as 100% if the doc file ends with ".pdf"
else I want to keep width and height attributes as auto.
How to write this condition?
Working stackblitz= https://stackblitz.com/edit/angular-ivy-ns536z
Solution
you can define another function in ts file call it to assign value of let str = this.pdfchecker(url)
Where pdfchecker will look something like this:
pdfchecker(url){
const last = url.split('.');
if(last[last.length -1] == 'pdf'){
let str = //value of str
return str
}else{
let str = //other value of str
return str
}
}