NaomiCreate / cnss-app

0 stars 0 forks source link

Removing the indentations in the table (in contact-list page) #14

Open NaomiCreate opened 3 years ago

NaomiCreate commented 3 years ago

(31.12.20) The rows in the table are added dynamically, so we used ngFor within div, and in this way, a row will be added for each contact that is in the collection contacts in firebase. But this created indentations within the table.
The reason: the use of a div within a table is forbidden (the use of a div within a td or th is allowed). Not valid:

    <tbody>
        <div *ngFor="let item of contact">
            <div *ngIf="!item.isEdit; else elseBlock">  
                <tr>  
                        ....

The fix: We changed the location of the ngFor so it will be inside the tr tag instead of inside the div tag. Valid:

    <tbody *ngFor="let item of contact">
                <tr *ngIf="!item.isEdit; else elseBlock">   
                        ....