错误类型错误：无法读取未定义的属性“first_name”

Question

i get this error When i try to render the list to the view from a backend service, am able to get the response data and log it to the console but it wont render on the view.

enter code here

 import { Component, OnInit, Input } from '@angular/core'; import { StudentsService } from '../services/students.service'; import { Student } from '../interfaces/Student'; @Component({ selector: 'app-student', templateUrl: './student.component.html', styleUrls: ['./student.component.css'], }) export class StudentComponent implements OnInit { @Input() student: Student; students: Student[]; constructor(private studentService: StudentsService) {} ngOnInit() { this.studentService.getStudents().subscribe((students) => { (data) => { this.students = data.json(); Array.of(this.students); }; console.log(students); }); } }

 export interface Student { id: number; first_name: string; last_name: string; date_of_birth: Date; }

 <div class="container mt-5"> <ul *ngFor="let student of students"> <li>{{student.first_name}}</li> </ul> </div>

Answer 1

   (data) => {
        this.students = data.json();
        Array.of(this.students);
      };

it shouldn't be a function. change it to something like this:

import { Component, OnInit, Input } from '@angular/core';
import { StudentsService } from '../services/students.service';
import { Student } from '../interfaces/Student';

@Component({
  selector: 'app-student',
  templateUrl: './student.component.html',
  styleUrls: ['./student.component.css'],
})
export class StudentComponent implements OnInit {
  @Input() student: Student;
  students: Student[];
  constructor(private studentService: StudentsService) {}

  ngOnInit() {
          this.studentService.getStudents().subscribe((students) => {
      this.students = students; // students is response from server. if it is not Student[] you should map it to correct type.
    });
  }
}