在单个对象中以角度显示表格数据时出现问题
我有一个角度的功能：
memberDtos=[];
getDataOfDtoCache(cacheData:any,nameOfCache:String){
console.log(nameOfCache);
this.hasTableClicked=true;
this.memberDtos.push(cacheData);
this.tableName=nameOfCache;
console.log(this.memberDtos);
}
在做console.log（this.memberDtos）; 我得到一个对象为：
GBIM: false GBI: false NCHL_T: false NCHLST: false NIB_Q: false NIBL_S: false P_RQ: false PES: false SQ: false SBL_RES: false STLME_REQ: false STL_IME_RES: false STLIBL_REQ: false SN_RES: false STRVU_REQ: false SU_RES: false S_REQ: false STL_RES: false 我希望这个单个对象以表形式出现：
在此处输入图片说明
但是在html部分中，我使用KendoUI作为：
<kendo-grid [kendoGridBinding]="memberDtos"
[resizable]="true"
[filterable]="true"
[groupable]="true"
[sortable]="true"
[pageable]="{
buttonCount:4,
pageSizes:[5,10,15]
}"
[pageSize]="5"
*ngIf="hasTableClicked && tableName=='Member DTO'" >
<kendo-grid-column field="memberId" title="Bo Id" width="70">
</kendo-grid-column>
<kendo-grid-column field="memberCode" title="Client Dealer Id" width="100s">
</kendo-grid-column>
</kendo-grid>
但是在我的用户界面中，我将所有数据放在一行中，如下所示：
在此处输入图片说明
它只是向我显示单行。我希望整个数据都放在不同的行中，我能否获得它？
版权声明：本文内容由阿里云实名注册用户自发贡献，版权归原作者所有，阿里云开发者社区不拥有其著作权，亦不承担相应法律责任。具体规则请查看《阿里云开发者社区用户服务协议》和《阿里云开发者社区知识产权保护指引》。如果您发现本社区中有涉嫌抄袭的内容，填写侵权投诉表单进行举报，一经查实，本社区将立刻删除涉嫌侵权内容。
从你的描述来看，你希望将JavaScript对象以表格形式展示在HTML页面上，并且你正在使用Kendo UI来实现这一功能。为了达到这个目的，你需要确保几个关键步骤已经完成：
-
数据转换：首先，确保你的
memberDtos数组中的对象结构与Kendo UI Grid期望的数据格式相匹配。通常，Kendo UI Grid期望每行数据是一个对象，其中的属性名作为列标题，属性值作为单元格内容。 -
定义列：在你的Angular组件中，你需要明确地定义Kendo UI Grid的列配置，以便它知道如何解析和显示你的数据。这可以通过
columns属性来完成。
假设你的JavaScript对象结构如你所展示，你可以这样定义列：
public gridColumns: any[] = [
{ field: 'GBIM', title: 'GBIM' },
{ field: 'GBI', title: 'GBI' },
{ field: 'NCHL_T', title: 'NCHL_T' },
// ... 其他列
{ field: 'STL_RES', title: 'STL_RES' }
];
- 绑定到HTML：然后，在你的HTML模板中，通过
columns属性将这些列绑定到Kendo UI Grid上：
<kendo-grid [data]="memberDtos" [columns]="gridColumns"
[resizable]="true"
[filterable]="true"
[groupable]="true"
[sortable]="true"
[pageable]="{
buttonCount:4,
pageSizes:[5,10,15]
}"
[pageSize]="5"
*ngIf="hasTableClicked">
</kendo-grid>
确保[data]="memberDtos"和[columns]="gridColumns"已经被正确绑定，这样当this.memberDtos被填充后，Kendo Grid会自动更新并显示数据。
如果getDataOfDtoCache方法是在服务中调用并且需要跨组件共享数据，你可能还需要考虑使用 Angular 的服务和RxJS的Subject或BehaviorSubject来传递数据。
以上步骤应该能帮助你在页面上以表格形式展示你的数据。如果遇到任何具体错误或问题，请提供更详细的信息以便进一步协助。
