So I'm trying to zebra stripe my ng-repeat
so the rows can be easily distinguished.
I think I have everything wired up correctly, but the classes just aren't being applied.
I've created a plunker here.
My html looks like this:
<div ng-repeat="removal in removals" ng-class-even="even" ng-class-odd="odd" class="remove-relation-titles-list">
<div class="pull-left relation-titles-left-list">
<span class="acct-title acct-num">{{removal.AcctType}} {{removal.AcctNo}}</span>
<span class="acct-title"> - Standard Checking</span>
</div>
</div>
So, the regular class is being applied just fine, but the even and odd ones aren't at all. If you inspect the object and add the even
class yourself, it shows up beautifully. I've tried moving this down to the div
inside the ng-repeat
with no results.
Am I missing something obvious?
Change your ng-class to:-
ng-class="{'even':$even,'odd':$odd}"
Plnkr
$even
and $odd
are the properties added by ng-repeat on its scope.
or change it to take string value of the class names otherwise it will try to replace the class based on the property even
or odd
which does not exist:-
ng-class-odd="'odd'" ng-class-even="'even'"
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