Angular material grid, rowHeight fit

Question

I am currently working with different content, with different materials Grid, I would like my tiles to be automatically height, but using the tag, but I I'm not the result I want to get, so I have to use the tag.

my code:

  <mat-grid-list class="quot-service-grid" cols="9" [rowHeight]="fit">
    <mat-grid-tile [colspan]="6" class="quot-service-element">

      <div class="quot-service-inf">
        <h2 class="quot-service-name lw-grey">{{service.name}}</h2>
        <p class="lw-grey">{{service.description}}</p>
      </div>

    </mat-grid-tile>
    <mat-grid-tile class="left quot-service-comment" [colspan]="3">
    </mat-grid-tile>
  </mat-grid-list>

Thanks

Solution

As you can see here: https://github.com/angular/material2/issues/10395

Regrettably, Angular has the worst Google material implementation (in comparison to VueJS/Vuetify or React/MaterialUI),..

In your case Angular Flex Layout would be the better solution: https://github.com/angular/flex-layout

Some demos are here online; https://tburleson-layouts-demos.firebaseapp.com/#/docs

Comments

[Julian]

this is still the case in the mid of 2021