javascript 是否可以更改 ngx-datatable-column 名称?
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/46661305/
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
Is it possible to change the ngx-datatable-column name?
提问by Amit Haim
I am building an angular2 web application and I have a ngx-datatableelement.
The columns (header) names are numbers.
我正在构建一个 angular2 Web 应用程序,并且我有一个ngx-datatable元素。列(标题)名称是数字。
Is there any way that I can edit those names in view?
有什么办法可以在视图中编辑这些名称吗?
After search I could not find a lot of information about ngx-datatable-column, and even the resources that was about ngx-datatable-column, didn't show the possibility of changing the column name even in code.
搜索后我找不到很多关于 的信息ngx-datatable-column,甚至是关于 的资源,ngx-datatable-column即使在代码中也没有显示更改列名的可能性。
回答by Randi Ratnayake
Documentation is very comprehensive for such matters. All Samples and Demo: http://swimlane.github.io/ngx-datatable/
对于此类问题,文档非常全面。所有示例和演示:http: //swimlane.github.io/ngx-datatable/
You will see more types of option in this sample code. https://github.com/swimlane/ngx-datatable/blob/1883b3ac1284307bb3dafa4cb299aad6a90b3c10/demo/templates/template-dom.component.ts
您将在此示例代码中看到更多类型的选项。 https://github.com/swimlane/ngx-datatable/blob/1883b3ac1284307bb3dafa4cb299aad6a90b3c10/demo/templates/template-dom.component.ts
What you are looking at is ngx-datatable-header-template
您正在查看的是ngx-datatable-header-template
Option 1
选项1
<ngx-datatable-column name="Your Column Name">
<ng-template let-column="column" ngx-datatable-header-template>
<span">{{column.name}}</span>
</ng-template>
<ng-template let-row="row" ngx-datatable-cell-template>
{{row.DataField}}
</ng-template>
</ngx-datatable-column>
Option 2
选项 2
<ngx-datatable-column>
<ng-template ngx-datatable-header-template>
<span>Your Column Name</span>
</ng-template>
<ng-template let-row="row" ngx-datatable-cell-template>
{{row.DataField}}
</ng-template>
</ngx-datatable-column>
回答by Ubaldo Reyes
You can use the property name:
您可以使用属性名称:
example:
例子:
columnsInput = [
{ prop: 'Id' }, { prop: 'DeviceId', width: 280 },{ prop: 'LogTimeStamp', name: 'Log Time', width: 220 } ]
where columnInputis the [columns] property in ngx-datatable
其中columnInput是在[列]属性NGX-数据表
<ngx-datatable #table class='material' [columns]="columnInput" [rows]="rowInput" </ngx-datatable>
this will display something like:
这将显示如下内容:
header: [Id DeviceId Log Time]
values: [1 111 12121]
Id/DeviceId/LogTimeStamp is actually the object you assign in the [rows], so for this example you row should be something like:
Id/DeviceId/LogTimeStamp 实际上是您在 中分配的对象[rows],因此对于此示例,您的行应该类似于:
rowInput: { Id: 1, DeviceId: 111, LogTimeStamp: 12121 }
回答by puneetShanbhag
If you just want to see your own names for the column header in your view you can do it by setting both the properties called name and prop appropriately , see example below.
如果您只想在视图中查看自己的列标题名称,可以通过适当设置名为 name 和 prop 的属性来实现,请参见下面的示例。
<ngx-datatable-column name="My Custom Column Header" prop="client">
<ng-template let-value="value" ngx-datatable-cell-template>
<strong>{{ value.clientCode }} </strong> - {{ value.clientName }}
</ng-template>
</ngx-datatable-column>
Please refer the Ngx datatable input documentsfor more details
更多细节请参考Ngx 数据表输入文档
Cheers !!
干杯!!

