CODEWITHSUNDEEP
angularrowsmat-table
Clément Nguyen
Clément Nguyen

Reputation: 23

Ng If to false creates empty rows Mat Table Angular

I created a Mat Table with angular, when i put a condition to get only the data i want, it shows me the data i want but also some empty rows which is, i think, the data which dosn't respect the condition.

Here is the table : Mat table empty rows

Here is one of the part of the code

   <ng-container matColumnDef="NumContrat">
  <th mat-header-cell *matHeaderCellDef mat-sort-header> Numéro de contrat </th>
  <ng-container mat-cell *matCellDef="let element">
     <ng-container *ngIf="element.DateSignaturePrestataire == null;">
        <td>{{element.NumContrat}} </td>
     </ng-container>
  </ng-container>

Upvotes: 0

Views: 1038

Answers (1)

Hansaka Sandaruwan
Hansaka Sandaruwan

Reputation: 521

Best way to filter your dataSource Array for this.

  • You can use something like this

    dataSourceArray = dataSourceArray.filter(element=> element.DateSignaturePrestataire != null)

In your code you are simply hiding the data but the row is still present.that is why you are getting those empty rows.In your approach you have to repeat your ngIf condition in every row which is not a very good coding practice.

Upvotes: 1

Related Questions