来自 firestore 的 ngFor-loop 中的 DomSanitizer

如何解决来自 firestore 的 ngFor-loop 中的 DomSanitizer

可能有类似的问题，但没有一个对我有帮助。我尝试使用 service.page.ts 从 firestore 获取 URL：

'Z'

这适用于所有字符串，但不适用于“url”。在 ts 文件中，我使用 ngOnInit

  baustellenAbfrage(): Observable<Baustellen[]>{
    return this.afStore.collection<Baustellen>(`Baustellen`).valueChanges();
  }

并通过以下方式获取我的信息：

import { Component,OnInit,ElementRef,SecurityContext } from '@angular/core';

import { Baustellen } from '../baustellen/baustellen.interface';
import { BaustellenService } from '../baustellen/baustellen.service';
import { Observable } from 'rxjs';
import { DomSanitizer,SafeResourceUrl } from '@angular/platform-browser';
import { Pipe,PipeTransform } from '@angular/core';



@Component({
  selector: 'app-baustellen',templateUrl: './baustellen.page.html',styleUrls: ['./baustellen.page.scss'],})
    export class BaustellenPage implements PipeTransform,OnInit{
      bstUrl: SafeResourceUrl;
      public baustellen: Observable<Baustellen[]>;
    
      constructor(
        private baustellenService: BaustellenService,private sanitizer: DomSanitizer) { }
    
      ngOnInit() {
        this.baustellen = this.baustellenService.baustellenAbfrage();
      }
    
      transform(bstUrl) {
        return this.sanitizer.bypassSecurityTrustResourceUrl(bstUrl);
      }
      
    }

在我的 HTML 上。

要获取 url-part，我使用 iframe：

*ngFor="let bst of baustellen | async"

我知道我必须使用 DomSanitizer 但它不起作用，我不知道如何使用“bst.bstUrl”作为安全 url。问题是，这必须是一个动态链接。

如何在我的 ngFor-Loop 中“集成”DomSanitizer？如您所见，在 baustellen.page.ts 中，我尝试使用 DomSanitizer，但这不起作用。我也用管道

    <iframe src="{{bst.bstUrl}}"
      width="100%" height="150px" style="border:0;" allowfullscreen="" loading="lazy">
    </iframe>

但后来我收到此错误：错误错误：未捕获（承诺）：ReferenceError：初始化前无法访问“BaustellenPageModule” 参考错误：初始化前无法访问“BaustellenPageModule” 在 Module.BaustellenPageModule (baustellen-baustellen-module.js:10398)