我们可以使用Angular中的ng模型在html表格中显示数据吗,数据库是firestore

时间:2019-09-19 08:40:31

标签: angular google-cloud-firestore

我想以表格格式显示我的数据,它出现在输入字段中,而不是出现在表格中,为什么呢?我该怎么解决。

<!DOCTYPE html>
<h1>Call Details Dashboard </h1>
    <label>Name:</label>
    <select [(ngModel)] = "selectedLevel" (change)="selected()" >
      <option *ngFor="let post of posts | async" [ngValue]="post">{{post.user}} 
      </option>
    </select>
<table class="TFtable">  
      <tr >   
          <th>Name</th> <th>Duration</th>  <th>Time</th> <th>Type</th>  
      </tr>  

  <tr *ngFor="let post of posts |async" [(ngModel)] = "selectedLevel.user">
    <td>{{ post.callDuration }}</td>
    <td>{{ post.callTime }}</td>
    <td>{{ post.callType }}</td>
  </tr>  
</table>  //require not as per my requirement


<label>Duration:</label>
<input type="type"name="callDuration" [(ngModel)]="selectedLevel.callDuration"> //wokring perfect

1 个答案:

答案 0 :(得分:0)

您正在使用输入标签显示数据。您需要使用表格标签。在这里,您可以看到表格的示例代码。

stackblitz