How to color paint a table in Angular?

120 views Asked by At

Here is the rub. I need to color cells in a html table.

The table is made by a ngFor and is 7 column wide. Each column is a component created by the ngFor.

<table>
    <app-day-display-schedule *ngFor="let day of daysOfWeek" [day]="day" [colorToPaint]="colorToPaint"
        [activityId]="activityId" #dataCellToPaint></app-day-display-schedule>
</table>

I tried with ViewChild but, obviously, I can only paint the first cell in each component.

I made a test with ViewChildren

@ViewChildren('dataCellToPaint') dataCellToPaint: QueryList<NgModel>;

ngAfterViewInit() {
    console.log(this.dataCellToPaint);
}

So I get the list with all 7 components inside, but how can I say from which cell I want to start painting ? Should I ForEach() each time I want to paint ?

I set up the methods in the child component for the painting but I am a bit at loss how I should make them work.

Any help appreciated. Cheers.

0

There are 0 answers