<Angular 5 Filter'＆gt;地图＆gt;将图像分配给OpenWeather对象并且不显示屏幕上的显示

Question

我正在尝试填充预测中的图像（5天预测），首先只过滤晴朗的天气，然后使用地图分配图像URL，然后在HTML中为每个天气项目询问，但是似乎没有得到图像的来源[src] = clearImage.imaging任何想法？

Here is my editable project on Stackblitz

Answer 1

我不明白为什么要创建新列表clearImage并在模板中引用它。我也很惊讶，由于物体是通过参照传递的，你实际上已经添加了成像＆＃39;通过过滤器的预测中的项目。因此，您仍然可以将其引用为[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;
        });