Reusable Material dialogue dialogue not opening external url with pdf

Question

I have a material dialog template that i want to use to open and download pdf files from an external link(url) in another component but its not working.It says the url is unsafe.Any idea will be appreciated

import { Component, OnInit, ViewChild, ElementRef, Inject, forwardRef, ChangeDetectorRef, SecurityContext,Pipe, PipeTransform,Input,AfterViewInit } from '@angular/core';
import { DomSanitizer, SafeResourceUrl } from '@angular/platform-browser';
//import { DialogComponent, DialogService } from 'ng2-bootstrap-modal';
import { ElementAst } from '@angular/compiler';
import {ConfirmdialogService} from './../services/confirmdialog.service';
import {MAT_DIALOG_DATA,MatDialogRef,MatDialog} from '@angular/material/dialog';
import {EmployeedocsComponent} from './../upload/employeedocs/employeedocs.component';
import { DocumentService } from "../services/document.service";
import { ShareReplayConfig } from 'rxjs/internal-compatibility';
export interface ViewerModel {
title: string;
NodeID: string;
}
@Component({
selector: 'viewer',
template: `
<h1 mat-dialog-title>{{title}}</h1>
<mat-dialog-content>
<iframe width="640" height="390" [src]="NodeID | safe">
</iframe>
</mat-dialog-content>
<div mat-dialog-actions>
<button mat-button (click)="onNoClick()">Close</button>
</div>
`
})
@Pipe({ name: 'safe' })
export class ViewerComponent implements PipeTransform {
constructor(
public dialogRef: MatDialogRef<ViewerComponent>,public sanitizer: DomSanitizer,
@Inject(MAT_DIALOG_DATA) public data: ViewerModel) { }
title: string;
NodeID: string;
transform(NodeID) {
return this.sanitizer.bypassSecurityTrustResourceUrl(this.NodeID);
}
ngOnInit(){
}
onNoClick(): void {
this.dialogRef.close();
}
}

Here is how i want to open pdf Urls from another component using the above materail dialog template

this.url = this.sanitizer.bypassSecurityTrustResourceUrl(this.DownloadURL.concat(employid) +"/" +this.downloaddoc.Name);
const dialogWithForm = this.dialogModel.open(ViewerComponent, {
data: { title: this.downloaddoc.Name, NodeID: this.url}
});
dialogWithForm.afterClosed().subscribe(result => {
console.log('You have closed the dialog');
if (result) {
this.downloaddoc.Name = result.title;
this.url = result.NodeID;
}
});