Фильтр Angular 5> Карта> Присвоить изображение объекту OpenWeather и отображение на экране не отображается

Question

Я пытаюсь заполнить изображения в прогнозах (5-дневный прогноз), сначала отфильтровывая только ясную погоду, а затем используя карту, чтобы назначить URL изображения, а затем в HTML запросить это для каждого элемента погоды, но это не получается получить источник изображения [src] = clearImage.imaging какие-либо идеи?

Вот мой редактируемый проект на Stackblitz

Answer 1

Я не понимаю, почему вы создаете новый список clearImage и ссылаетесь на него в шаблоне. Я также удивлен тем, что из-за того, что объекты были переданы по ссылке, вы фактически добавили «изображения» в элементы в прогнозах, которые проходят фильтр. Таким образом, вы могли бы по-прежнему ссылаться на них как [src]="forecast.imaging", и это будет работать.

Однако правильный способ - манипулировать самим ответом API. Я не уверен, почему ты не сделал это так:

this.forecasts.list = this.forecasts.list
        .filter(item => item.weather[0].main.toLowerCase().indexOf('clear') > -1)
        .map(item => {
            item.imaging = 'https://icons.iconarchive.com/icons/icons8/ios7/96/Weather-Sun-icon.png';
            return item;
        });