angular2 项目中img动态指定图片路径

在项目中需要动态根据默写状态显示指定图片。

 

   <img src="./images/A.png" >

正常都是使用静态路径显示，为了动态变化需要对src属性进行单项绑定。采用差值表达式

<img  src="{{isShow == 1 ? './images/A.png' :'./images/B.png'}} ">

 我理解实际就是对dom属性的单向绑定（参照博文  https://segmentfault.com/a/1190000012674948）。

<img [src]="isShow == 1 ? './images/A.png' :'./images/B.png' ">

 可是如果写成下面的方式就无效了。

<img  src="isShow == 1 ? './images/A.png' :'./images/B.png' ">

 因为这个是设置html的属性，在解析html文件时ng并不会处理此类逻辑，html属性是不会变化的。

注意：只有dom属性和html属性一一对应才能将插值表达式和dom属性单项绑定效果等同，否则不行。