如何改变&lt;的src IMG&GT;当我知道<img/> ID?

时间:2017-04-01 11:25:07

标签: typescript angular2-components

我在* ngFor循环中显示一组图像。

itemimg.component.html

<div *ngFor="let itemimg of itemimgs" [class.selected]="itemimg === selectedItemimg" 
            (click)="onSelect(itemimg)"> 
    <img id="{{itemimg.index}}" class="thumb" src="{{itemimg.imageUrl}}" width="{{itemimg.width}}" height="{{itemimg.height}}" 
        style="float: left; margin-right: 3px; margin-bottom: 3px">
</div>

当我点击任何想要替换第一张图像的图像时。

itemimg.components.ts(part)

  onSelect(itemimg: Itemimg): void{ 
    this.selectedItemimg = itemimg;
    var newsrc = "../../assets/images/" + itemimg.route + ".jpg";
    //alert (newsrc);
    *what-goes-here* = newsrc;    // the problem
  }

我用谷歌搜索了三个多小时但找不到答案。谢谢你的期待。

2 个答案:

答案 0 :(得分:1)

请考虑您始终要替换阵列中的第一张图片,请执行以下操作:

onSelect(itemimg: Itemimg): void{ 
this.selectedItemimg = itemimg;
var newsrc = "../../assets/images/" + itemimg.route + ".jpg";
//alert (newsrc);
this.itemimgs[0].imageUrl = newsrc;  

}

答案 1 :(得分:0)

您想要替换数组imageUrl中第一张图片的itemimgs

所以你需要的只是

this.itemimgs[0].imageUrl = newsrc;