У меня есть функция перетаскивания, чтобы скомпилировать массив изображений.Для того, чтобы показать, что было добавлено в массив, я храню их в localstorage и устанавливаю как переменную с именем selectedGallery, которая затем повторяется на дисплее, но не обновляется, когда я добавляю новое изображение. Новый объектпередается в локальное хранилище, но с использованием наблюдаемой темы изменения, кажется, происходят на вкладке приложения, но не обновляются в представлении.
.html
<label>Gallery Images</label>
<div class="gallery">
<ng-container *ngFor="let image of selectedGallery">
<img class="placeholder" [src]="imageUrl + image.url" alt="selected image thumbnail">
</ng-container>
</div>
Итак, здесь я выполняю итерации изображений из selectedGallery, и когда я вручную обновляю страницу, массив изображений обновляется.Я запустил быстрый console.log для следующего, который вызывается на ngOnInit:
.component.ts
this.watchStorage().subscribe(
(data: any) => {
this.selectedGallery = data;
console.log(this.selectedGallery);//returns undefined :/
}
)
это только журналы не определены.
вот немного больше контекста:
.component.ts
private storageSubject = new Subject<string>();
watchStorage(): Observable<any>{
return this.storageSubject.asObservable();
}
this.configService.uploadImage(imageUpload)
.subscribe(
response => {
if (response) {
imageFile = response.data;
if (localStorage) {
var selectedImages;
if (!localStorage['selectedImages']) selectedImages = [];
else selectedImages = JSON.parse(localStorage['selectedImages']);
if (!(selectedImages instanceof Array)) selectedImages = [];
selectedImages.push(imageFile);
localStorage.setItem('selectedImages', JSON.stringify(selectedImages));
this.storageSubject.next('image');
}
}});
ngOnInit() {
this.watchStorage().subscribe(
(data: any) => {
this.selectedGallery = data.result;
console.log(this.selectedGallery);//this logs undefined :/
}
)
}
как есть, не обновляет selectedGallery вПосмотрите, и я не уверен, почему.
Кто-нибудь имел эту проблему раньше?
почесал голову прямо сейчас ...