Question

如何使用列和行创建动态HTML表？以下是JSON数据，我想使用此数据创建HTML表：

{
    "columnNames": [
        "Applicant ID(id|Optional)",
        "Roll No",
        "Applicant Name",
        "Password",
        "CA ID",
        "Shift Name",
        "Shift Date",
        "Start Time",
        "End Time"
    ],
    "rows": [
        [
            "122",
            "18",
            "Amit",
            "12345",
            "42",
            "testShift2",
            "2019-12-31",
            "13:00",
            "16:00"
        ]
    ]
}

Answer 1

假设您的json存储在Environment.GetEnvironmentVariable("MSSQL_CONN_STR");中，

尝试这样：

data

Answer 2

尝试下面的代码可以正常工作。

<table>
  <tr>
    <th *ngFor=" let header of data?.columnNames">{{header}}</th>
  </tr>
 <tbody>
    <tr *ngFor=" let row of data?.rows">
    <td *ngFor=" let item of row">{{item}}</td>
  </tr>
 </tbody>
</table>

JSON转换为Angular中的动态HTML表

2 个答案: