Geek Answers Handbook

How to get a fixed column width with ngtable?

I bow my head on ngtable . Just one question, how can I make columns a fixed width? In this example, the column of the account and adviser has a variable width when moving to the next page. This is html:

 <table ng-table="tableParams" template-pagination="custom/pager" class="table"> <tr ng-repeat="account in $data | filter:accountName | filter:key" class="orders tablerow"> <td data-title="'ID'" sortable="'account.accountId.key'"> {{account.account.accountId.key}} </td> <td data-title="'Account'" sortable="'account.accountName'"> {{account.account.accountName}} </td> <td data-title="'Adviser'" sortable="'account.adviser.key'"> {{account.account.adviser.key}} </td> <td data-title="'Product'" sortable="'account.productName'"> {{account.account.productName}} </td> <td data-title="'Status'" sortable="'minOpenOrderState'"> {{account.minOpenOrderState}} </td> </tr> </table>

Plunkr: http://plnkr.co/edit/vPQeVx?p=info

+4
source share
2 answers

just add css for "td"

 td{ width:20%; float:left; word-wrap:break-word; }
+3
source

The accepted answer works fine, but it does not apply to the case when most of the width of the columns does not matter, but 1-2 columns should have a fixed width (or at least not shrink).

One workflow is to force the width of a column to determine the contents of a fixed width. Something like that:

  <td title="'TheTitle'" sortable="'PassedStr'"> <div style="width:120px"> <b>{{item.SomeCol}}</b> <span ng-show="item.ErrorMessage"> {{item.OtherCol}} </span> </div> </td>
+2
source

More articles:


All Articles