Question

我正在尝试使用NgFor指令显示具有id和name的对象列表，但我收到以下错误：

错误：无法找到'object'类型的不同支持对象'[object Object]'。 NgFor仅支持绑定到诸如Arrays之类的Iterables。

以下是代码文件供参考。

`heroes.component.ts：

此文件已声明了英雄对象。

Option Explicit

Sub ColTest()

Const ENGLAND = "ENGLAND"
Const USA = "USA"
Const MATHS = "MATHS"
Const HISTORY = "HISTORY"
Const COL_NAME = 1
Const COL_COUNTRY = 2
Const COL_SUBJECT = 3
Const COL_MARK = 4

Dim col As New Collection
Dim rg As Range
Dim line As StudentLine
Dim i As Long
Dim country As String
Dim subject As String


    Set rg = Range("A2:E13")
    Dim sngRow As Range
    Dim vdat As Variant

    vdat = rg

    For i = LBound(vdat) To UBound(vdat)
        country = UCase(vdat(i, COL_COUNTRY))
        subject = UCase(vdat(i, COL_SUBJECT))
        If country = ENGLAND Or country = USA Then
            If subject = MATHS Or subject = HISTORY Then
                Set line = New StudentLine
                With line
                    .student = vdat(i, COL_NAME)
                    .country = vdat(i, COL_COUNTRY)
                    .subject = vdat(i, COL_SUBJECT)
                    .mark = vdat(i, COL_MARK)
                End With
                col.Add line
            End If
        End If
    Next i

    For i = 1 To col.Count
        Debug.Print col.Item(i).student, col.Item(i).country, col.Item(i).subject, col.Item(i).mark
    Next i

End Sub

heroes.component.html：

这是我在

标签中使用NgFor的文件。

import { Component, OnInit } from '@angular/core';

  import { Hero } from '../hero';

  import { HEROES } from '../mock-heroes';
  @Component({
    selector: 'app-heroes',
    templateUrl: './heroes.component.html',
    styleUrls: ['./heroes.component.css']
  })

  export class HeroesComponent implements OnInit {   
    heroes = HEROES;
  }

模拟heroes.ts：

此文件包含我想要在UI上显示的英雄的常量对象。

 <ul class="heroes">
    <li *ngFor="let hero of heroes">
     <span class="badge">{{hero.id}}</span> {{hero.name}}
    </li>
  </ul>

你能帮我吗？

Answer 1

ngFor不支持对象请尝试以下操作：

export const HEROES: Hero[] =[

     {id:11 , name:'Mr. Nice'},
     {id:12 , name:'Narco'},
     {id:13 , name:'Bombasto'}
];

Answer 2

由于错误表示

找不到不同的支持对象＆＃39; [object Object]＆＃39;类型＆＃39;对象＆＃39;

你的英雄应该是阵列而不是物体。把它改成，

const HEROES: Hero[] =[
     {id:11 , name:'Mr. Nice'},
     {id:12 , name:'Narco'},
     {id:13 , name:'Bombasto'}
];

<强> STACKBLITZ DEMO

Answer 3

你应该将HEROES定义为一个数组，使用[ ]而不是{ }作为外部括号：

[
  { ... },
  { ... },
]

而不是

{
  { ... },
  { ... },
}

Angular NgFor Issue

3 个答案: