Angular ngFor不适用于阵列

这是我的密码：

import { Component } from '@angular/core';
import { ProjectService } from '../../services/project';
import { Project } from '../../models/project';

@Component({
    selector: 'projects-component',
    template: `
        <pre>{{ projects | json }}</pre>
        <span>I WORK</span>
        <span *ngFor="let project of projects"> here: {{ project | json }} </span>
    `,
    styleUrls: ['./style.css']
})
export class ProjectsComponent {

    projects: Project[];

    constructor(
        private projectService: ProjectService
    ) {
        this.projectService.projects().then((projects) => {
            this.projects = projects;
            console.log('Projects:',this.projects);
        });
    }
}

从'@angular/core'导入{Component}；
从“../../services/project”导入{ProjectService}；
从“../../models/Project”导入{Project}；
@组成部分({
选择器：“项目组件”，
模板：`
 <span *ngFor="let project of projects.projects"> here: {{ project  }} </span>

{{projects | json}}
我工作
此处：{project | json}
`,
样式URL:['./style.css']
})
导出类项目组件{
项目：项目[]；
建造师(
私人项目服务：项目服务
) {
this.projectService.projects（）。然后（（projects）=>{
这个项目=项目；
log（'Projects:'，this.Projects）；
});
}
}

这将打印以下内容：

here:{{project | json}

应该打印每个项目，但它不是，起初我怀疑可能有一些css应用于

标记，所以我添加了

I WORK

，以确保没有可疑的事情发生

---

我的代码中缺少了什么才能使*NGF正常工作？

基于您给出的JSON，projects有另一个名为projects的对象。你需要

这里：{{project}

也不需要

| json

管道