我正在努力弄清楚我的代码有什么问题。我正在尝试从我的角度代码中调用rest API,但是它导致“ TypeError:无法读取未定义的属性'id'”
我的clients.ervice.ts代码看起来像这样:
import { Injectable } from '@angular/core';
import { Clients } from './clients.model';
import { HttpClient, HttpErrorResponse } from '@angular/common/http';
import { Observable} from 'rxjs';
@Injectable({
providedIn: 'root'
})
export class ClientsService {
clientsUrl="http://localhost:21063/api/clints
constructor(private http:HttpClient) { }
getAllClients():Observable<Clients[]>{
return this.http.get<Clients[]>(this.clientsUrl);
}
我的client.component.ts中的代码
constructor(private formBuilder: FormBuilder, private Service: ClientsService) { }
clients:Clients[];
ngOnInit() {
this.Service.getAllClients()
.subscribe(data => this.clients=data);
这是model.ts
export class Clients {
id:number;
name:string;
phone:string;
address:string;
type:string;
account:number;
nots:string;
branchId:number;
}
最后是我的庙宇:
<tbody>
<tr *ngFor="let item of clients"></tr>
<td>{{item.id}} </td>
<td>{{item.name}} </td>
<td>{{item.phone}} </td>
<td>{{item.address}} </td>
<td>{{item.account}} </td>
<td>{{item.nots}} </td>
</tbody>
预先感谢您提供帮助来解决和了解此问题的帮助
没问题,您自己放轻松,您忘了让tr元素包装所有td元素
<tbody>
<tr *ngFor="let item of clients">
<td>{{item.id}} </td>
<td>{{item.name}} </td>
<td>{{item.phone}} </td>
<td>{{item.address}} </td>
<td>{{item.account}} </td>
<td>{{item.nots}} </td>
</tr>
</tbody>