I have a group of students that I display using the *ngFor directive. The list of students is passed from the parent component. When the student list is empty, I still want to show an empty row on the component. Here is the array:
@Input() studentList: Student[] = []; //child property
And in the parent component:
get studentList(): Student[] { //parent property
const arr: Array<Student> = new Array<Student>();
if (getStudents()){
arr=getStudents();
}
else{
arr.push(new Student());
return (arr);
}
}
The getStudents() method is just a mock method that returns null. The Student class has properties such as idNumber and studentName. However, if the array is empty, the *ngFor directive does not display any rows.