带有键值管道的 ngFor:类型“未知”不可分配给类型“NgIterable<any>”

我正在尝试迭代这个对象

{
  "2021-11-22": [
    {
      "id": 1,
      "standard_id": 2,
      "user_id": 4,
      "subject_id": 1,
      "exam_date": "2021-11-22",
      "start_time": "09:45:00",
      "end_time": "02:52:00",
      "description": "kjhkjhkjhkjhkjnnnjgfhgfhgfghfghfhg",
      "deleted_at": null,
      "created_at": "2021-11-22T03:47:34.000000Z",
      "updated_at": "2021-11-22T03:47:34.000000Z",
      "subject": {
        "id": 1,
        "standard_id": 2,
        "name": "engilsh",
        "deleted_at": null,
        "created_at": "2021-11-21T07:11:15.000000Z",
        "updated_at": "2021-11-21T07:11:15.000000Z"
      }
    },
    {
      "id": 2,
      "standard_id": 2,
      "user_id": 4,
      "subject_id": 2,
      "exam_date": "2021-11-22",
      "start_time": "09:45:00",
      "end_time": "10:45:00",
      "description": "kjhkjhkjhkjhkjnnnjgfhgfhgfghfghfhg",
      "deleted_at": null,
      "created_at": "2021-11-22T03:49:41.000000Z",
      "updated_at": "2021-11-22T03:49:41.000000Z",
      "subject": {
        "id": 2,
        "standard_id": 2,
        "name": "Physics",
        "deleted_at": null,
        "created_at": "2021-11-21T07:17:25.000000Z",
        "updated_at": "2021-11-21T07:17:25.000000Z"
      }
    }
  ],
  "2021-11-23": [
    {
      "id": 3,
      "standard_id": 2,
      "user_id": 4,
      "subject_id": 1,
      "exam_date": "2021-11-23",
      "start_time": "09:30:00",
      "end_time": "10:30:00",
      "description": null,
      "deleted_at": null,
      "created_at": "2021-11-22T04:52:04.000000Z",
      "updated_at": "2021-11-22T04:52:04.000000Z",
      "subject": {
        "id": 1,
        "standard_id": 2,
        "name": "engilsh",
        "deleted_at": null,
        "created_at": "2021-11-21T07:11:15.000000Z",
        "updated_at": "2021-11-21T07:11:15.000000Z"
      }
    },
    {
      "id": 4,
      "standard_id": 2,
      "user_id": 4,
      "subject_id": 2,
      "exam_date": "2021-11-23",
      "start_time": "09:30:00",
      "end_time": "10:30:00",
      "description": null,
      "deleted_at": null,
      "created_at": "2021-11-22T04:53:18.000000Z",
      "updated_at": "2021-11-22T04:53:18.000000Z",
      "subject": {
        "id": 2,
        "standard_id": 2,
        "name": "Physics",
        "deleted_at": null,
        "created_at": "2021-11-21T07:17:25.000000Z",
        "updated_at": "2021-11-21T07:17:25.000000Z"
      }
    }
  ]
}

我尝试将 *ngForkeyvalue 管道一起使用来循环,但在尝试 ngFor 获取值时遇到问题。这是我尝试过的

<ion-accordion-group>
  <ion-accordion value="{{item.key}}" *ngFor="let item of exams | keyvalue">
    <ion-item slot="header">
      <ion-icon slot="start" name="calendar-outline" color="danger"></ion-icon>
      <ion-label>Exam Date: {{item.key}}</ion-label>
      <!-- <ion-label class="ion-text-wrap">hh{{item.value | json}}</ion-label> -->
    </ion-item>
    <ion-list slot="content">
      <ion-item *ngFor="let items of item['value']">
        <ion-icon slot="start" name="trash" color="danger"></ion-icon>
        <ion-label class="ion-text-wrap">
          <h2>{{items.subject.name | titlecase}}</h2>
          <p>{{items.description}}<br />Posted By {{items.user.name | titlecase}}</p>
          <p>Start Time: {{items.start_time}}<br />End Time: {{items.end_time}}</p>
        </ion-label>
      </ion-item>
    </ion-list>
  </ion-accordion>
</ion-accordion-group>

第二个 *ngFor 给出错误

类型“未知”不可分配给类型“NgIterable”。

stack overflow ngFor with keyvalue pipe: Type 'unknown' is not assignable to type 'NgIterable<any>'
原文答案
author avatar

接受的答案

尝试使用 $any() 禁用模板中的类型检查。

<ion-item *ngFor="let items of $any(item).value">
...
</ion-item>

答案:

作者头像

对我来说,结果是键值管道中使用的变量无效,这会导致 *ngFor 中的每个变量引用都记录一个关于未知的错误。

修理:

  • 确保您在 *ngFor 中引用了正确的变量
  • 确保你的组件文件有一个变量类型用于被引用的内容

    $any() 的最佳答案最有可能解决症状但未解决原始原因

相关问题