Есть ли простой способ получить URL-адрес загрузки из путей firesbase-storage в Angular шаблонах - PullRequest
0 голосов
/ 04 августа 2020

Я видел примеры, когда люди сохраняли фактический путь загрузки в firestore, а затем использовали это изображение в шаблонах.

Однако я не уверен, что это правильный метод для сохранения местоположения файлов . По той простой причине, что при получении URL-адреса загрузки он содержит токены, которые, как я предполагаю, предназначены для того, чтобы текущий пользователь получил URL-адрес загрузки. downloadUrl с кодом компонентов для URL-адреса загрузки. Есть ли способ избежать этого, просто добавьте его прямо в файлы шаблонов. Поэтому мне не нужно манипулировать простыми отображаемыми данными, которые содержат ссылки на изображения для firestorage.

1 Ответ

0 голосов
/ 04 августа 2020

Вы можете создать для этого простой канал:

import { Pipe, PipeTransform } from '@angular/core';
import { AngularFireStorage } from '@angular/fire/storage';
import { Observable, from } from 'rxjs';

@Pipe({
   name: 'firestoagePath'
})
export class FirestoagePathPipe implements PipeTransform {
    constructor(private storage: AngularFireStorage) { }
    transform(value: string, ...args: unknown[]): Observable<string> {
      if (typeof (value) === 'string') {
          const storageRef = this.storage.ref(value);
          return storageRef.getDownloadURL();
      }
      return from(value);
   }
}

С помощью каналов вы можете делать инъекции в firestore, что приятно, получите URL-адрес загрузки и соедините его с конвейером asyn c следующим образом:

<img *ngIf="firestoreObject.image.croppedSource | firestoagePath | async as imageSource"
    [src]="imageSource">

в этом примере firestoreObject - это случайный объект с изображением, которое имеет строковый путь к местоположению файла обрезанного изображения на firestorage.

...