Блог

Вот мой HTML

 <mat-grid-list cols="3" rowHeight="150px">
 <mat-grid-tile
    *ngFor="let tile of tiles;index as j;"
     [colspan]="tile.cols"
     [rowspan]="tile.rows"
     >
   <div (onclick)="openbox();" style="z-index: 2">
                                       
          {{tile.text}}<br>
          <img src="https://images.unsplash.com/photo-1514888286974-6c03e2ca1dba?ixid=MXwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHw=amp;ixlib=rb-1.2.1amp;auto=formatamp;fit=cropamp;w=1027amp;q=80" height="200px" width="260px">
   </div>
    </mat-grid-tile>
</mat-grid-list>
 

Ts

 export class RegistrationComponent implements OnInit {
...
 openbox(){
    console.log('clicked')
  }
...
}
 

Вещи, которые я пробовал:

style="z-index: 2; position: relative;"
Инкогнито

Браузер Chrome Angular-9
Моя цель — получить индекс нажатой мат-сетки-плитки есть ли другой способ сделать это?
Спасибо

Вы должны использовать событие (click). onClick не работает, потому что компилятор Angular не распознает его, и это относится ко всем событиям браузера с префиксом on . Если вы не хотите использовать событие в Angular, вам нужно удалить on .

 <div (click)="openbox();" style="z-index: 2">
   ...
</div>