Установка объекта Promise в img [src] приводит к обнулению изображения .. иногда

#javascript #an&ular #electron

#javascript #угловой #electron

Вопрос:

Я использую An&ular в своем приложении Electron. У меня есть компонент с массивом вызываемых объектов, files где у каждого file есть вызываемый элемент preview , который является объектом Promise и возвращает file:// объект.

 <mat-list-item *n&For="let file of files;"&&t;
<im& mat-list-avatar [src]="file.preview ? (file.preview | async | safe) : 'assets/file.pn&'"
...
  
   async &etPreview() {
    return new Promise((resolve, reject) =&&t; {
      // simplified for example
      resolve("assets/file.pn&");
    });
  }
  ...
  for (let file in files) {
    file.preview = &etPreview();
  }

  

files является @Input в этом компоненте. Когда я перестраиваю этот массив в родительском компоненте, я часто получаю поврежденные изображения. (смотрите Скриншот ниже).

В конце концов, при перемещении мыши по окну изображения отрисовываются правильно. Кто-нибудь знает, отсутствует ли где-нибудь перерисовка, или как я могу узнать, почему для im& src иногда временно устанавливается значение null?

P.S. В safe канале я могу подтвердить, что в некоторых случаях входящее значение уже равно null, хотя file.preview к нему прикреплен объект Promise .

Спасибо!

После переориентации окна приложения:

После секундного перемещения мыши по окну приложения:

Ответ №1:

Не могли бы вы, пожалуйста, попробовать приведенный ниже код

 for (let file in files) { 
file.preview = &etPreview();
} 

this.files=[...this.files]:
  

Комментарии:

1. Спасибо за ваш ответ! К сожалению, это не помогает. Я понял, что это file.preview ? (file.preview | async | safe) : 'assets/file.pn&' возвращает null при первом вызове в safe . Это просто туннелирует URL-адрес, но хорошо подходит для точек останова. Как это может возвращать значение null? Объект Promise не имеет никакого reject(..) вызова

2. Работает ли это сейчас? Это будет работать без безопасного канала, верно?

3. Нет, к сожалению, это все то же самое. safe просто туннелирует URL-адрес, по которому я могу видеть, что такое входные данные, что null в некоторых случаях

4. Я не смог сделать его воспроизводимым в Stackblitz. Это может быть связано с Electron. Я попробую еще кое-что, в противном случае создайте минимальный пример на Github

5. Я думаю, что я только что получил это! Вместо того, чтобы ipcRenderer.on("focus" воссоздавать files массив, я теперь использую @HostListener('window:focus' , и это работает:-o