Тип «SafeResourceUrl» нельзя назначить типу «строка»

Question

Я пытаюсь очистить PDF-URL и хочу присвоить его переменной строкового типа, чтобы я мог использовать его для просмотра PDF.Есть ли способ сделать это?Если я использую тип any для типа pdfSrc, я получаю Invalid parameter object: need either .data, .range or .url in the <pdf-viewer>.

Примечание: URL-адрес, который я использовал, является справочным, в этом месте я бы использовал внешние URL-адреса

landingpage.component.ts

import { DomSanitizer, SafeResourceUrl, SafeUrl } from '@angular/platform-browser';

export class LandingpageComponent implements OnInit {
     public pdfSrc: string;
}

constructor(    
    private sanitizer: DomSanitizer) {
}

fnOpenAsset() {     
   let url = 'http://localhost/pdf_viewer-master/18/docs/pdf.pdf';
   this.pdfSrc = this.sanitizer.bypassSecurityTrustResourceUrl(url);
}

landingpage.component.html

<pdf-viewer class="alignComponentCenter" [src]="pdfSrc" 
</pdf-viewer>

Answer 1

Как уже предлагалось, вы можете просто удалить объявление переменной (или объявить тип any), но я сомневаюсь, что многие согласятся с правильным решением.

Различные методы Dom Sanitizer не возвращают строки, они возвращают различные типы объектов.

См. Официальные документы API: https://angular.io/api/platform-browser/DomSanitizer

this.sanitizer.bypassSecurityTrustResourceUrl(url);

Возвращает объект типа SafeResourceUrl, а не строку; поэтому ваша декларация должна отражать это, а не туманный тип any.

Answer 2

У меня есть способ это исправить. Я снова попытался очистить SafeResourceUrl с помощью метода sanitize(), возвращаемое значение которого равно string | ноль.

Если вы хотите использовать bypassSecurityTrustUrl(), то будет иметь место SecurityContext.URL. В моем случае я использовал SecurityContext.RESOURCE_URL

export class LandingpageComponent implements OnInit {
     public pdfSrc: string;
}

constructor(    
    private sanitizer: DomSanitizer) {
}

fnOpenAsset() {     
   let url = 'http://localhost/pdf_viewer-master/18/docs/pdf.pdf';
   this.pdfSrc = this.sanitizer.sanitize(SecurityContext.RESOURCE_URL, this.sanitizer.bypassSecurityTrustResourceUrl(url));
}```

Answer 3

Вынуть объявление переменной

pdfSrc : any;

fnOpenAsset() {     
   let url = 'http://localhost/pdf_viewer-master/18/docs/pdf.pdf';
   this.pdfSrc = this.sanitizer.bypassSecurityTrustResourceUrl(url);
}