如何在跨度中对齐角度标签内容

Question

我需要正确对齐两个信息，即采购订单号和供应商，怎么做？

from

PO Number: 344 Vendor: yu
PO Number: 3445 Vendor: yu
PO Number: 344 Vendor: yu

to

PO Number: 344   Vendor: yu
PO Number: 3445  Vendor: yu
PO Number: 344   Vendor: yu

<div *ngFor="let n of listof_POs" style="color: white;">
      <span><b>PO Number: {{n.po_number}} &nbsp; &nbsp;Vendor: {{n.vendorname}} </b></s
</div>

Answer 1

看起来您尝试以非常困难的方式创建表格，为什么不尝试以下操作： https : //www.w3schools.com/angular/angular_tables.asp

HTML

<table>
  <tr ng-repeat="n in listof_POs">
  <td>PO Number: {{ n.po_number}}</td>
  <td>Vendor {{ n.vendorname}}</td>
 </tr>
</table>

Answer 2

如果可以使用 Angular Flex Layout，就可以这样处理。

<div *ngFor="let n of listof_POs" style="color: white;" fxLayout="row">
      <b fxFlex="50%">PO Number: {{n.po_number}}</b>
      <b fxFlex="50%">Vendor: {{n.vendorname}}</b>
</div>


You can also use CSS Flexbox to achieve this