我尝试使用primeng中的p-table组件,但是我无法显示学生的名字和姓氏,因为它是headArray中的对象,建议如何解决这个问题?
我的“学生”模式
id: number;
name: Name;
和名称模型
firstName: string;
lastName: string;
超文本标记语言
<p-table [value]="students">
<ng-template pTemplate="header">
<tr>
<th *ngFor="let head of headArray">
{{head.Head}}
</th>
</tr>
</ng-template>
<ng-template pTemplate="body" let-student>
<tr>
<td *ngFor="let head of headArray">
{{student[head.FieldName]}}
</td>
</tr>
</ng-template>
typescript
public headArray = [
{ 'Head': 'Last Name', 'FieldName': 'name["lastName"]' },
{ 'Head': 'First Name', 'FieldName': 'name["firstName"]' },
{ 'Head': 'ID', 'FieldName': 'id' }
];
public getStudents(): void {
this.studentService.getStudents().subscribe(
(response: Student[]) => {
console.log(response);
this.students = response;
},
(error: HttpErrorResponse) => {
alert(error.message);
}
)
我也试过了,可惜没成功
public headArray = [
{ 'Head': 'Last Name', 'FieldName': 'name.lastName' },
{ 'Head': 'First Name', 'FieldName': 'name.firstName' },
{ 'Head': 'Id', 'FieldName': 'id' }
];
getStudents方法在调用ngOnInit时运行,并填充学生数组
2条答案
按热度按时间jv4diomz1#
要访问嵌套对象,我们可以创建自定义管道来将字符串点符号转换为对象键
f8rj6qna2#
您可以使用点表示法访问模板中“name”对象的嵌套属性。在Typescript文件中,将
headArray
中的"FieldName"
值分别更改为'name.firstName'
和'name.lastName'
。在HTML中
希望这有帮助!干杯!!