📌  相关文章
📜  无法绑定到“ngForOf”,因为它不是“th”的已知属性 - Javascript (1)

📅  最后修改于: 2023-12-03 15:26:16.828000             🧑  作者: Mango

无法绑定到“ngForOf”,因为它不是“th”的已知属性 - Javascript

当在使用Angular中的table组件时,可能会出现以下错误:

Can't bind to 'ngForOf' since it isn't a known property of 'th'.

这个错误的原因是你想使用ngForOf指令来循环绑定table中的数据行。

解决这个问题非常简单,只需将*ngFor改为*ngForOf即可。因为table中的数据行是由<tr>标签组成的,<tr>标签不是一个直接支持ngForOf的指令,但是他的父级<tbody>标签支持。

以下是正确的使用方式:

<table>
  <thead>
    <tr>
      <th>Header1</th>
      <th>Header2</th>
      <th>Header3</th>
    </tr>
  </thead>
  <tbody>
    <tr *ngFor="let item of items">
      <td>{{ item.column1 }}</td>
      <td>{{ item.column2 }}</td>
      <td>{{ item.column3 }}</td>
    </tr>
  </tbody>
</table>

本文针对Angular 2+版本的开发,如果您使用的是AngularJS版本的应用程序,则可能需要使用ng-repeat指令。

在这种情况下,将代码更改为以下内容:

<table>
  <thead>
    <tr>
      <th>Header1</th>
      <th>Header2</th>
      <th>Header3</th>
    </tr>
  </thead>
  <tbody>
    <tr ng-repeat="item in items">
      <td>{{ item.column1 }}</td>
      <td>{{ item.column2 }}</td>
      <td>{{ item.column3 }}</td>
    </tr>
  </tbody>
</table>

总之,为了解决这个问题,您需要将*ngFor改为*ngForOf和确定正确的父级容器。

希望本文能够帮助您理解这个错误并解决它。