Issue
I have this textbox
<input type="text" [ngStyle]="(show_div===true) ? {'border-color':'red','color':'red'} : {'border-color': 'green','color':'green'}" [(ngModel)]="values[i]"/>
If show_div
variable is true i want to make {'border-color':'red','color':'red'}
if it is false then i have to make it {'border-color': 'green','color':'green'}
but initially i want to make textbox and text color black, green and red is working but initially also the text are green but that should be black.
Any solution Thanks
Solution
You would need to show the corresponding ts code to get a more accurate response. Based on the information you have provided, I would assume that the initial of show_div
is undefined
. If that is the case, then you need to add another condition in your ternary as follows.
<input type="text" [ngStyle]="(show_div===true) ? {'border-color':'red','color':'red'} : show_div === undefined ? {'border-color': 'black','color':'black'} : {'border-color': 'green','color':'green'}" [(ngModel)]="values[i]"/>
This is really making your html very verbose and difficult to read though. Personally, I would put these styles in your styles file and associate them with a class. I would then switch the classes dynamically in your component instead of the styles.
Answered By - peinearydevelopment
0 comments:
Post a Comment
Note: Only a member of this blog may post a comment.