Why does a property array always return null in template

Question

I have the following code in my angular template

{{myObject.dayList|async|json}}

However this always displays "null" in the page despite the object being populated in the component. This is proven by the fact that I can log it to the console and it has populated data.

If I do

{{myObject|async|json}}

It displays the json for the object including the populated dayList array!

What is going on?

This is myObject

export class myObject{
    public timetableItems:TimetableItemViewModel[];
    public dayList:number[];
}

Contents of log

{dayList: Array(1), timetableItems: Array(2)}dayList: [1]timetableItems: (2) [{…}, {…}]0: {assignedClass: {…}, assignedRoom: {…}, assignedPeriod: {…}}1: assignedClass: {classId: 1027, className: "English1", subjectId: 2004, periodCount: 1, assets: Array(1), …}assignedPeriod: {periodId: 1006, dayNumber: 1, periodTypeId: 2, accountId: "00000000-0000-0000-0000-000000000000", periodNumber: 2}assignedRoom: {roomId: 19, roomName: "Room1", subjectId: 2004, assets: Array(1), capacity: 20, …}proto: Objectlength: 2__proto__: Array(0)proto: Object

Answer 1

Your log has dayList not dayItems. Try :

`<div *ngIf="myObject| async; let obj">
    {{obj.dayList | json}}
 </div>`

Note: Modified answer based on Cristian's comment