display values of object from json ionic 3 - json

Question

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>{{card.question}}</h2>
<h2>{{card.answer}}</h2>
<h2>{{card.hint}}</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"
}
]
}