Home > database >  I want to change the selected button to primary button. I am sending id to asp.net core and changing
I want to change the selected button to primary button. I am sending id to asp.net core and changing

Time:07-11

<ng-container *ngIf="question.questionType == 4"> <ng-container *ngFor="let answer of question.answers"> <button (click)="setanswer(answer.answerId)" [value]="answer.isSelected" name="{{answer.answerId}}">{{answer.answerDescription}}

CodePudding user response:

You have a bunch of alternatives, let's say you have this css class defined:

.primary {
  background-color: green;
}
<!-- 1) Property Binding -->
<button [class.primary]="answer.isSelected"></button>

<!-- 2) NgClass -->
<button [ngClass]="{ 'primary': answer.isSelected }"></button>

<!-- 3) ngStyle-->
<button [ngStyle]="{ 'background-color': answer.isSelected ? 'green' : 'blue' }"></button>

Sidenote, in your button HTML definition, you need to use property binding for name, not string interpolation, all html attributes can be used in Angular with property binding

 <button 
   (click)="setanswer(answer.answerId)"   
   [value]="answer.isSelected" 
    
   [name]="answer.answerId">{{ answer.answerDescription }}
</button>
  • Related