Html 表中内容的对齐

我需要创建一个表，如下图所示。当我加载来自字典的令人敬畏的字体图标时，字体的对齐被破坏了。我正在努力使每一列和图标之间的空间是分散的，他们应该在行动列下对齐。提前谢谢

数据=[
{
“日期”：“11月1日”，
'姓名'：“班加罗鲁”，
“实体”：14，
'详情'：'Lorem Ipsum，Lorem Ipsum'，
“操作”：“fa-fa-envelope-o”
},
{
“日期”：“11月2日”，
'姓名'：“海得拉巴”，
“实体”：17，
“详细信息”：“Lorem Ipsum，Lorem Ipsum，Ipsum”，
“操作”：“fa-fa-envelope-o”
},
{
“日期”：“11月3日”，
'姓名'：“钦奈”，
“实体”：50，
‘详情’：‘Lorem，Lorem Ipsum，Lorem Ipsum’，
“操作”：“fa-fa-envelope-o”
},
{
“日期”：“11月4日”，
‘名字’：‘孟买’，
“实体”：20，
“详细信息”：“Lorem Ipsum，Lorem，Lorem Ipsum”，
“操作”：“fa-fa-信封-o、fa-fa共享alt、fa-fa-trash-o、fa-fa铅笔”
},
{
“日期”：“11月5日”，
“名称”：“喀拉拉邦”，
“实体”：10，
‘详情’：‘Lorem，Lorem Ipsum，Lorem Ipsum’，
“操作”：“fa-fa-信封-o、fa-fa共享alt、fa-fa-trash-o、fa-fa铅笔”
},
{
“日期”：“11月6日”，
'姓名'：“博帕尔”，
“实体”：4，
“详细信息”：“Lorem sum、Ipsum、Lorem sum”，
“操作”：“fa-fa-信封-o、fa-fa共享alt、fa-fa-trash-o、fa-fa铅笔”
},
{
“日期”：“11月7日”，
'姓名'：“印多尔”，
“实体”：54，
“详情”：“Lorem Ipsum，rem Ipsum，rem Ipsum”，
“操作”：“fa-fa-信封-o、fa-fa共享alt、fa-fa-trash-o、fa-fa铅笔”
},
{
“日期”：“11月8日”，
“姓名”：“Thane”，
“实体”：1，
“详细信息”：“Lorem Ipsum”，
“操作”：“fa-fa-信封-o、fa-fa共享alt、fa-fa-trash-o、fa-fa铅笔”
},
{
“日期”：“11月9日”，
'姓名'：“浦那”，
“实体”：64，
“详情”：“Lorem Ipsum，Lorem Ipsum，Pune”，
“操作”：“fa-fa-信封-o、fa-fa共享alt、fa-fa-trash-o、fa-fa铅笔”
},
{
“日期”：“11月10日”，
'姓名'：“卡奇”，
“实体”：224，
“详细信息”：“Lorem Ipsum，PrivateCurrcle，Lorem Ipsum”，
“操作”：“fa-fa-信封-o、fa-fa共享alt、fa-fa-trash-o、fa-fa铅笔”
},
{
“日期”：“11月11日”，
'姓名'：“班加罗鲁”，
“实体”：114，
“详细信息”：“PrivateCircle，Lorem Ipsum，Lorem Ipsum”，
“操作”：“fa-fa-信封-o、fa-fa共享alt、fa-fa-trash-o、fa-fa铅笔”
},
{
“日期”：“11月12日”，
“姓名”：“J&k”，
“实体”：214，
“详细信息”：“Lorem Ipsum，PrivateCurrcle，Lorem Ipsum”，
“操作”：“fa-fa-信封-o、fa-fa共享alt、fa-fa-trash-o、fa-fa铅笔”
},
{
“日期”：“11月13日”，
'姓名'：“旁遮普”，
“实体”：134，
“详细信息”：“Lorem Privatecycle、Lorem Ipsum、Lorem Ipsum”，
“操作”：“fa-fa-信封-o、fa-fa共享alt、fa-fa-trash-o、fa-fa铅笔”
},
{
“日期”：“11月14日”，
'姓名'：“班加罗鲁”，
“实体”：144，
“详细信息”：“同侧眼线、同侧眼线、LoPrivateCircleum”，
“操作”：“fa-fa-信封-o、fa-fa共享alt、fa-fa-trash-o、fa-fa铅笔”
},
{
“日期”：“11月15日”，
'姓名'：“加尔各答”，
“实体”：154，
“详细信息”：“同侧眼界、同侧眼界、同侧眼界”，
“操作”：“fa-fa-信封-o、fa-fa共享alt、fa-fa-trash-o、fa-fa铅笔”
},
{
“日期”：“11月16日”，
'姓名'：“德里”，
“实体”：164，
“详细信息”：“Lorem Ipsum，PrivateCurclem，Lorem Ipsum”，
“操作”：“fa-fa-信封-o、fa-fa共享alt、fa-fa-trash-o、fa-fa铅笔”
},
{
“日期”：“11月17日”，
'姓名'：“迈苏鲁”，
“实体”：14，
“详细信息”：“PrivateCircle，Lorem Ipsum，Lorem Ipsum”，
“操作”：“fa-fa-信封-o、fa-fa共享alt、fa-fa-trash-o、fa-fa铅笔”
},
{
“日期”：“11月19日”，
“名称”：“Vizag”，
“实体”：154，
“详细信息”：“Lorem Ipsum，Lorem Ipsum，PrivateCurrcle”，
“操作”：“fa-fa-信封-o、fa-fa共享alt、fa-fa-trash-o、fa-fa铅笔”
},
{
“日期”：“11月12日”，
'姓名'：“阿格拉”，
“实体”：14，
“详细信息”：“Lorem Ipsum，Pune，Lorem Ipsum”，
“操作”：“fa-fa-信封-o、fa-fa共享alt、fa-fa-trash-o、fa-fa铅笔”
}]

日期
列表名
实体数目
行动
{{items.date}
{{items.name}
{{items.entities}}
细节
还没有描述+添加描述
{{str}

不要在
上使用
*ngFor
，像这样使用它

<td>
    <span *ngFor="let x of items.actions.split(',')">
        <i class="{{x}}"></i>
    </span>
</td>



如果您还有问题，请告诉我