매트 테이블에 오류가 표시되고 값이 표시되지 않음

Question

restapi 서비스의 값을 표시하는 재료 각도 테이블.

angular5 타이프 스크립트를 사용합니다.

배열 형식

<mat-table #table > 
      <ng-container matColumnDef="username"> 
       <mat-header-cell> `ID` </mat-header-cell> 
       <mat-cell *ngFor="let visit of Visits"> {{visit.username}} 
       </mat-cell> 
      </ng-container> 

     <ng-container matColumnDef="height"> 
     <mat-header-cell> ID </mat-header-cell> 
     <mat-cell *ngFor="let visit of Visits"> {{visit.height}} </mat-cell> 
     </ng-container> 

     <ng-container matColumnDef="weight"> 
     <mat-header-cell> Progress </mat-header-cell> 
     <mat-cell *ngFor="let visit"> {{visit.weight}}% </mat-cell> 
     </ng-container> 
     <ng-container matColumnDef="patientnote"> 
     <mat-header-cell > Name </mat-header-cell> 
     <mat-cell *ngFor="let visit"> {{visit.patientnote}} </mat-cell> 
     </ng-container> 

     <ng-container matColumnDef="doctornote"> 
     <mat-header-cell > Color </mat-header-cell> 
     <mat-cell *ngFor="let visit"> {{visit.doctornote}} </mat-cell> 
     </ng-container> 

    </mat-table> 

여기 내 타이프 라이터 코드

내가 자료 angular.please에 새로운 오전 오류의

export class HomeComponent implements OnInit { 

    public Visits: any; 

    public constructor(private location: Location, private http: Http, private router: Router){ 

     } 

    public ngOnInit() { 
    this.http.get('http://localhost:8080/api/visit') 
    .map(result => ['result']) 
    .subscribe(result => { 

     this.Visits = result ; 

     console.log('submit get click happend ' + this.Visits); 

    }); 

    } 

스크린 샷에서 서비스의 값을 받고 내가 고칠 수있게 도와 줘. 미리 감사드립니다.

Answer 1

응답은 단순한 객체 일 뿐이므로 DOM의 ngFor 내부에서 생성 할 객체 배열이어야합니다.

응답을 개체 배열로 변경하거나 개체를 빈 배열로 푸시합니다.