Randomize the questions and display on the page

Ionic Framework ionic-v3
1

I created an array object questions in question.ts file and i want to display on the view each question randomly with “Next” button.
How can solve it?
I need you talented mind! thanks

Here is below those files related with it

<!-- question.html -->

<ion-header>

  <ion-navbar>
    <ion-title><strong>Page de Questions</strong></ion-title>
  </ion-navbar>

</ion-header>


<ion-content padding>

    <p style="display: inline; color: green;"><strong>Score: 0</strong></p>
    <ion-icon name="heart" style="display: inline; color: red; float: right; margin-right: 10px;"></ion-icon>
    <ion-icon name="heart" style="display: inline; color: red; float: right; margin-right: 10px;"></ion-icon>
    <ion-icon name="heart" style="display: inline; color: red; float: right; margin-right: 10px;"></ion-icon><br>


    <p *ngFor="let question of questions">{{question.Q}}</p>


    <ion-footer no-border="">
        <ion-toolbar position="bottom" class="fancyButton_Toolbar">
            <button ion-button color="secondary" round class="fancyButton" style="position: absolute; left: 0;" (click)="goToResults('Vrai');">Vrai</button>
            <ion-icon name="contact" style="margin-left: 144px; color: #c7254e; font-size: 40px"></ion-icon>
            <ion-icon name="contact" style="color: #6610f2; font-size: 40px"></ion-icon>
            <button ion-button color="secondary" round class="fancyButton" style="position: absolute; right: 0; background-color: red" (click)="goToResults('Faux')">Faux</button>
        </ion-toolbar>
    </ion-footer>

</ion-content>


<!-- question.ts  -->

import { Component } from '@angular/core';
import { IonicPage, NavController, NavParams } from 'ionic-angular';
import { QuestionProvider} from "../../providers/question/question";

/**
 * Generated class for the QuestionPage page.
 *
 * See https://ionicframework.com/docs/components/#navigation for more info on
 * Ionic pages and navigation.
 */

@IonicPage()
@Component({
  selector: 'page-question',
  templateUrl: 'question.html',
})
export class QuestionPage {

    public response1 = "Bonne reponse";
    public response2 = "Mauvais reponse";

    questions: Array <any> = [];




  constructor(
      public navCtrl: NavController,
      public navParams: NavParams,
      private questionProvider: QuestionProvider
      ) {
      this.questions = [
          {
              id: 1,
              Q: 'Le surnom de Juventus est Monsieur?',
              A: 'Faux'
          },
          {
              id: 2,
              Q: 'Le surnom de Ac-Milan est Rossoneri?',
              A: 'Vrai'
          },
          {
              id: 3,
              Q: 'Le surnom de Liverpool est "The Blacks"?',
              A: 'Faux'
          },
          {
              id: 4,
              Q: 'Le surnom de Arsenal est "The Gunners"?',
              A: 'Vrai'
          },
          {
              id: 5,
              Q: 'Christophe est le fan de la Juventus?',
              A: 'Vrai'
          }
      ];
  }

  ionViewDidLoad() {
    //console.log('ionViewDidLoad QuestionPage');
    //this.questions['id'] = this.questions['1'];
      this.questionProvider.questionProgress = 0;

      this.questionProvider.getQuestions();

      // this.questionProvider.getQuestions().subscribe(
      //     (data: any) => {
      //         this.questionProvider.questions = data;
      //     }
      // )
  }



  goToResults(f) {

      if(this.questions['A'] == f){

          console.log(this.response1);
      }
      else{
          console.log(this.response2);
      }
      //this.storage.set('questions.id', this.questions['id']);
    //this.navCtrl.push(ResultPage);

  }



}


<!-- question.ts (provider)  -->

import { Injectable } from '@angular/core';



/*
  Generated class for the QuestionProvider provider.

  See https://angular.io/guide/dependency-injection for more info on providers
  and Angular DI.
*/
@Injectable()
export class QuestionProvider {

  // Properties
  questions: any[] = []; // an array stored such random questions
  seconds: number; // total time taken to finish the quiz
  timer; // count time taken
  questionProgress: number; // saved a number of questions that attended by participants

  // Helper Methods
  constructor() {
    //console.log('Hello QuestionProvider Provider');
  }


  getQuestions(): any {
    return this.questions;
  }



}