Menu
I am trying to add an array of classes to a row. my issue is that is duplicating the row. so my question is how can i loop though a arrow inside [ngClass]
my code that doesn't work.
.ts
@Input() rowClasses = ['someClass1', 'someClass2']
html
<table>
<thead>
<tr>
<th>some head</th>
</tr>
</thead>
<tbody>
<tr class="striped-row" *ngFor="class of rowClasses" [ngClass]="class"></tr>
</tbody>
</table>
599
Overview. You can use the ngClass directive to conditionally apply one-to-many classes or styles to an element, giving you an effective way to operate with multiple classes or styles at once.
To add a conditional class in Angular we can pass an object to ngClass where key is the class name and value is condition i.e., true or false as shown below. And in the above code, class name will be added only when the condition is true.
Combining NgStyle and NgClass Directives with our knowledge of Angular Template Syntax, we can marry conditional styling with Angular's Property & Event Binding.
In this article, we will see the String Interpolation, ngStyle, ngClass in Angular 7.0. In this article, we will see the creation of angular component and we will see how we can use String interpolation, setting a background color using ngStyle and setting a foreground color using ngClass based on some condition.
You don't need the for-loop you just have to directly assign your array to ngClass Example :
[ngClass]="rowClasses"
or
[ngClass]="['someClass1', 'someClass2']"
useful answere and documentation
200
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
