Menu
I was using angular's ng-repeat to print a div multiple times. But the styling seem to get a little wrong with the last child. I need to provide specific styling to the last-child of the ng-repeat's element. Here is what I was doing:
.link-tickets div:last-child{
float:left;
}<div class="medium-4 column no-pad-left link-tickets" ng-repeat="ticket_data in acct_details.tickets">
<p><a href="#details/{{acct_details.client_id}}/ticket/{{ticket_data.ticket_id}}"><strong class="bold-color">{{acct_details.client_name}}</strong></a>
<br>{{available_stages[ticket_data.stage_id].stage_name}}
<br>{{ticket_data.created_at | format | date}}</p>
</div>So, what am I doing wrong here?
230
You can use $last variable within ng-repeat directive. Take a look at doc. Where computeCssClass is function of controller which takes sole argument and returns 'last' or null .
You can nest two ng-repeat together in order to create a more complex table. The first ng-repeat in the tr tag will create the rows and the second one in the td tag will create one column per element in the collection.
Definition and Usage. The ng-repeat directive repeats a set of HTML, a given number of times. The set of HTML will be repeated once per item in a collection. The collection must be an array or an object. Note: Each instance of the repetition is given its own scope, which consist of the current item.
You can also use the special variable $last (or $first) which is available inside the ng-repeat loop.
$last has value true when the current element is the last one in the array. $first works the same but for the first element :)
Then you can use it inside ng-class like this
<ul>
<li ng-repeat="item in list" ng-class="{'last-item': $last}">
</ul>
and then define .last-item css class
156
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
