javascript - ngFor 没有显示 html 中的项目？ Angular 2/4

Question

这真的让我很烦恼。我正在尝试以 2/4 Angular 显示数组。我认为 Angular 有一个错误。 html、服务或组件部分，因为我的节点后端按其应有的方式工作。我的 html 看起来像这样。

<div class = "container">

<li *ngFor = "let customer of customers">
    <div class = "col md-6">
            {{ customer.firstName }}
    </div>
</li>
<div *ngFor = "let customer of customers">
    <div class = "col md-6">
            {{ customer.lastName }}
    </div>
</div>

我的服务是这样的

@Injectable()
export class CustomerService {

constructor(private http: Http) { }

//retreiving custmers
getCustomers(){
    return this.http.get('http://localhost:3001/api/customers')
    .map(res => res.json());
}
}

我的组件是这个

export class CustomersComponent implements OnInit {

customers: Customer[];
customer: Customer;
firstName: string;
lastName: string;

//initialize customer service   
constructor(private customerService: CustomerService) { }

//initiated once component is loaded
ngOnInit() {

this.customerService.getCustomers()
    .subscribe( customer => 
        this.customer = customer);


 }

Answer 1

您有一个拼写错误，请将customer更改为customers

this.customerService.getCustomers()
    .subscribe( customers => {

        this.customers = customers

      });

 }