javascript 带有过滤器列宽的角度数据表
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/32466190/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Angular datatables with filter column width
提问by Michael Lin
I tried to set width for column in angular datatables with filters. But width of the column not changed.
我尝试使用过滤器为角度数据表中的列设置宽度。但列的宽度没有改变。
I try following
我尝试跟随
var columnsSpecification = [
{
type: 'text',
bRegex: true,
bSmart: true
}, {
type: 'text',
bRegex: true,
sWidth:"90px"}];
$scope.dtOptions = DTOptionsBuilder.newOptions()
.withBootstrap()
.withOption('scrollX', '700%')
.withOption('scrollY', height + 'px')
.withOption('oLanguage', { "sEmptyTable": " " })
.withOption('lengthMenu', [[-1, 1000, 100, 50, 25, 10], ['All', 1000, 100, 50, 25, 10]])
.withOption('paging', false)
.withOption('bInfo',false)
.withColumnFilter({
aoColumns:columnsSpecification
})
.withTableTools('/Content/DataTables/swf/copy_csv_xls.swf')
.withTableToolsButtons(['xls']);
In html file I tried this:
在 html 文件中我试过这个：
<table id="table-machines" datatable="ng" class="table table-striped" dt-options="dtOptions">
<thead>
<tr>
<th>Name</th>
<th style="width: 90px !important">Value</th>
</tr>
</thead>
<tbody>
<tr ng-repeat="m in records>
<td>{{m.name}}</td>
<td style="width: 90px !important">{{m.Value}}</td>
</tr>
</tbody>
But Value column another zise rather I setted.
但价值列另一个 zise 而我设置。
I'v found, that if there is not filter - all fine.
我发现，如果没有过滤器 - 一切都很好。
How can I set table width and preserve filters?
如何设置表格宽度并保留过滤器？
回答by Haseena P A
vm.dtColumns = [
DTColumnBuilder.newColumn('id').withTitle('ID').withOption('width', '5%')
];
回答by l-lin
回答by Ignacio Ara
Finally I've found the solution for avoiding datatables overwrite bootstrap columns width definitions:
最后，我找到了避免数据表覆盖引导列宽度定义的解决方案：
$scope.dtOptions = DTOptionsBuilder.newOptions()
.withOption('autoWidth', false)
It was as easy as put that name and set to false... but it in the API doesn't appear to be available :(
就像把这个名字设置为 false 一样简单......但它在 API 中似乎不可用:(
