Javascript 以角度预览多个图像和视频

我在Angular应用程序中预览多个图像和视频时遇到问题。我有“format”变量来确定它是“image”还是“video”

---

您有

url

变量，但未初始化。当您将元素推送到未定义的变量时，它会抛出一个错误。要解决此问题，需要初始化变量，如下所示：

urls = [];

更新：在单独的阵列中添加图像和视频，然后循环：

export class AppComponent {
  imageUrls = [];
  videoUrls = [];
  onSelectFile(event) {
    const files = event.target.files;
    if (files) {
      for (const file of files) {
        const reader = new FileReader();
        reader.onload = (e: any) => {
          if (file.type.indexOf("image") > -1) {
            this.imageUrls.push(e.target.result);
          } else if (file.type.indexOf("video") > -1) {
            this.videoUrls.push(e.target.result);
          }
        };
        reader.readAsDataURL(file);
      }
    }
  }
}

这就是您显示的方式：

<ng-container>
    <img *ngFor="let url of imageUrls" [src]="url" />
</ng-container>

<ng-container>
    <video *ngFor="let url of videoUrls" [src]="url" controls></video>
</ng-container>

URL:any=[]-URL应该是数组，我已经更改了它，但仍然有问题。我想一起预览视频和图像谢谢你Maihan

<ng-container>
    <img *ngFor="let url of imageUrls" [src]="url" />
</ng-container>

<ng-container>
    <video *ngFor="let url of videoUrls" [src]="url" controls></video>
</ng-container>