display values of object from json ionic 3

I try to get a random object from a local Json file in my Ionic3 App.

Instead of displaying all "questions", "answers" and "hints" from my "cards", I would like to display only the values of a randomly selected card.

This is a dummy project and I am not sure what's the appropriate way to do this.

home.ts

  cards: any;

  getLocalData() {
    this.http.get('assets/data/cards.json').map(res => res.json()).subscribe(res => {
        this.cards = res.cards;
        this.cards.rd = this.cards[Math.floor(Math.random() * this.cards.length)];
        console.log(this.cards.rd);
    },
     (err) => {
      alert("failed loading json data");
    })
  }

home.html

 <button ion-button round (click)="getLocalData()">Charger</button>

    <ion-list>
      <ion-item *ngFor="let card of cards">
        <h2></h2>
        <h2></h2>
        <h2></h2>
      </ion-item>
    </ion-list> 

cards.json

{
  "cards": [
    {
      "id": "1", 
      "question": "question 1",
      "answer": "reponse 1",
      "hint": "hint 1"
    },
    {
      "id": "2",
      "question": "question 2",
      "answer": "reponse 2",
      "hint": "hint 2"
    },
    {
      "id": "3",
      "question": "question 3",
      "answer": "reponse 3",
      "hint": "hint 3"
    }
  ]
}