Search code examples
angulartypescriptpropertiesfor-in-loop

Typescript: For in loop over objects won't recognise object's properties


I'm using a for in to loop over a list of Meeting-objects called allMeetings. This loop is filling another list called allEvents, where objects other than Meeting will end up in. In that loop I'm trying to get the properties of the Meeting object, but they aren't recognised. I wonder how to solve or bypass it.

My Meeting model:

export class Meeting {
    id: UUID;
    date: Date;
    description: string;
}

The TS-File:
The loop is used in the makeEvents() method

...
import { Meeting } from '../models/meeting.model';
import { MeetingsService } from '../services/meetings.service';
...
export class SomeComponent implements OnInit {
    allEvents: SpikesEvent[] = undefined;
    allMeetings: Meeting[] = undefined;

   constructor(private _meetingsService: MeetingsService) { }

    ngOnInit() {
        this.loadMeetings();
        this.makeEvents();
    }

    loadMeetings(): void {
        this._meetingsService.getAllMeetings().subscribe(
            (allMeetings: Meeting[]) => {
                this.allMeetings = allMeetings;
            }
        );
    }

    makeEvents(): void {
        for (let meeting in this.allMeetings) {
            this.allEvents.push({
                start: startOfDay(meeting.date),
                title: meeting.description,
                color: colors.yellowsunflower,
                type: "meeting",
                id: meeting.id,
            });
        }
    }
}

So, date, description and id of meeting aren't recognised.

EDIT 1: Added the constructor in the TS-File.
EDIT 2: I'm retrieving my data from rethinkDB so there's no JSON-file but here's a log to prove that the Meeting object is in fact not empty:

date: "Fri Feb 20 1993 00:00:00 GMT+00:00", description: "meeting about dummy data", id: "088c0baf-3c02-48b2-a072-65905fb0c0a7"

Solution

  • Funny, everyone has missed the fact that you are iterating a list of objects with for ...in and trying to use the key as the object itself.

    That is why TypeScript "won't recognize" it's properties. If you want to use for-in:

    for (let meeting in this.allMeetings) {
        this.allEvents.push({
            start: startOfDay(this.allMeetings[meeting].date),
            //...
        });
    }
    

    I'd rather use forEach.

    The other answer about the asynchronous code is still valid for runtime execution though, but that is not the problem you are asking about here.