2015-06-26 16 views
6

Tôi đã sử dụng tính năng ng-lặp của góc để in nhiều lần div. Nhưng phong cách dường như có một chút sai lầm với đứa trẻ cuối cùng. Tôi cần cung cấp kiểu dáng cụ thể cho con cuối cùng của phần tử ng-repeat. Đây là những gì tôi đang làm:: đứa trẻ cuối cùng trong ng-repeat không hoạt động

.link-tickets div:last-child{ 
 
\t 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>

Vì vậy, những gì tôi làm sai ở đây?

+1

tôi điều bạn muốn này .link-vé : con cuối cùng { \t float: left; } –

+0

cảm ơn. nó đã làm việc. –

Trả lời

12

Bạn cũng có thể sử dụng biến số đặc biệt $last (hoặc $first) có sẵn bên trong vòng lặp ng-repeat.

$last có giá trị đúng khi phần tử hiện tại là phần tử cuối cùng trong mảng. $first hoạt động tương tự nhưng đối với phần tử đầu tiên :)

Sau đó, bạn có thể sử dụng nó bên ng-class như thế này

<ul> 
<li ng-repeat="item in list" ng-class="{'last-item': $last}"> 
</ul> 

và sau đó xác định .last-item css lớp

0

xin lỗi, tôi đã nhận được câu hỏi sai. Tôi đã tự tìm ra.

.medium-4.column.no-pad-left.link-tickets.ng-scope { 
 
    float: left; 
 
}

này là hoàn toàn làm việc ra.

Các vấn đề liên quan