hinzufügen fire base objekt ID zu routerlink attribut in Angular

Question

Also ich arbeite auf einer Website mit Angular und Firebase-Datenbank über Playstation-Spiele. Jedes Spiel, das ich anzeigen möchte, hat eine ID, die ich an das Attribut routerlink übergeben möchte. Ich weiß einfach nicht, wie ich das machen soll. Ich habe den folgenden Code ausprobiert (routerLink = ["/ games", {{game.key $}}]), aber es gibt mir den angezeigten Fehler. Kann mir jemand helfen?

<ng-container *ngFor="let game of games; let i = index"> 
     <div class="col-4"> 
     <div class="card"> 
      <img class="card-img-top" src="{{ game.imageUrl }}" alt="hello"> 
      <div class="card-body"> 
      <h4 class="card-title">{{ game.title }}</h4> 
      <p class="card-text">{{ game.category }}</p> 
      </div> 
      <div class="card-footer"> 
      <button 
       routerLink=["/games", {{game.key$}}] 
       class="btn btn-secondary btn-block">Available Tournaments 
      </button> 
      </div> 
     </div> 
     </div> 
     <div *ngIf="(i+1)%3 === 0" class="w-100"></div> 
     </ng-container> 

compiler.js:485 Uncaught Error: Template parse errors: Unexpected closing tag "button". It may happen when the tag has already been closed by another tag. For more info see https://www.w3.org/TR/html5/syntax.html#closing-elements-that-have-implied-end-tags (" {{game.key$}}] class="btn btn-secondary btn-block">Available Tournaments [ERROR ->]

Answer 1

die Sie interessieren,

<button [routerLink]="['/games', game.$key]" class="btn btn-secondary btn-block">Available Tournaments 
</button>