Change background image from td in table with ngIf in Angular-CodePudding

What do I have: A td in a table with a background image

<td background="assets/images/crew/sign.jpg" style="background-repeat: no-repeat; background-size: contain; background-position: center center">

What do i want: I would like to change the background image from the td in dependence of a boolean value my_boolean. If the bit is true, I would to display sign.jpg if the boolean is false i would like to display a different image different.jpg as the background image.

Thanks in advance

CodePudding user response：

Here Is my solution

<td [style]=
    "my_boolean
    ? 'background-image:url(assets/images/crew/sign.jpg) ;background-repeat:no-repeat;background-size: contain;background-position: center center'
    : 'background-image:url(assets/images/crew/diff.jpg) ;background-repeat:no-repeat;background-size: contain;background-position: center center'">

I am not a pro developer, maybe it is better to change the string sign.jpg to different.jpg

CodePudding user response：

Try the below code:

 <td *ngIF="myboolean" background="assets/images/crew/sign.jpg" style="background-repeat: no-repeat; background-size: contain; background-position: center center">
<td *ngIF="!myboolean" background="assets/images/crew/different.jpg" style="background-repeat: no-repeat; background-size: contain; background-position: center center">
Ts:
myboolean:boolean=true;

CodePudding user response：

Read this link, you can easily understand and solve it by yourself