How to set the previous clicked answer on going next question in angular 11

Question

Hello.. I m building a quiz app in angular 11, my issue is that when i click on one answer of question and going to next question previous clicked answer removed automatically how can fixed the answer on click it shouldn't remove when i go to next question.answer is appreciable thanks

    **HTML**
            <div>
                <div>
                    <h3> {{questionList[currentQuestion]?.questionText}}</h3>
                </div
            </div>
            <div >
              <ol *ngFor="let option of questionList[currentQuestion]?.options; let i=index">
                    <li  (click)=disble(questionList[currentQuestion].options,option,i)>
                       <label><input type="radio" name="options" value={{option}}> {{option}}</label><hr>

                </li>
            </ol>
        </div>
        <div>
            <button [disabled]="currentQuestion===0"(click)="previousQuestion()">/i>Previous</button>
            <button [disabled]="currentQuestion===(questionList.length-1)><(click)="nextQuestion()">Next</button>
          </div>

TS

import { Component, OnInit} from '@angular/core';


 @Component({
  selector: 'app-questions',
  templateUrl: './questions.component.html',
  styleUrls: ['./questions.component.css']
})



   constructor(private router:Router) { }
    public questionList:any=[];
    public currentQuestion:number=0;

   ngOnInit(): void {}

//suffle function for suffle the index of an array
   shuffle(array:any){
    var currentIndex = array.length, temporaryValue, randomIndex;
    while (0 !== currentIndex) {
    randomIndex = Math.floor(Math.random() * currentIndex);
    currentIndex -= 1;
    temporaryValue = array[currentIndex];
    array[currentIndex] = array[randomIndex];
    array[randomIndex] = temporaryValue;
    }
     return array;
  }

 getAllQuestions(){
   this.qzservice.getQuestion().subscribe(res=>{
     console.log('get all questions',res.questions)
     this.questionList=res.questions;
    var suffleArray= this.shuffle(this.questionList);
      console.log('shuffled array',suffleArray);
   })
 }
 nextQuestion(){
  this.currentQuestion++;
   }

 previousQuestion(){
  this.currentQuestion--;
 }

disble(data:any,opton:any,ind:any){
 var gvnAnswer =opton;
    var corrAnswer=this.questionList[this.currentQuestion].answer
if(gvnAnswer==corrAnswer){
     console.log('right answer')
   else{
     console.log('Incorrect answer')
}

}

quiz-service.service.ts

 questionUrl= '/assets/questions'
getQuestion(){
    return this.http.get<any>("assets/questions.json")
  }

questions.json

{
    "questions":[
            {
                "questionText":"The Kanjli Wetland in India is located in the state of -",
                "options":[
                    " Punjab",
                    "Rajasthan",
                    "Tamil Nadu",
                    "Gujarat"
                    ],
                "answer":" Punjab"
            },
        {
            "questionText":"Llanos grasslands are found in -",
            "options":[
                " Argentina",
                "Venezuela",
                "Paraguay",
                "Brazil"
                ],
             "answer":"Venezuela"
        },
        {
            "questionText":"Who was the last ruler of Shunga dynasty?",
            "options":[
                " Pulinda",
                "Andhrak",
                "Devbhuti",
                "Vasumitra"
                 ],
             "answer":"Devbhuti"
        },
        {

            "questionText":"In which session did the Indian National Congress adopt the resolution for Puma Swaraj?",
            "options":[
                " Calcutta",
                "Lahore",
                "Madras",
                "Lucknow"
             ],
             "answer":"Lahore"
          },
        {
            "questionText":"Sputnik vaccine of Corona is developed by which of the following countries?",
            "options":[
                " India",
                "China",
                "Canada",
                "Russia"
                ],
            "answer":"Russia"    
        }        
    ]       
}   

Answer 1

You need to store the given answer in some array or object. so that when you revisited your question you will be able to pull the given answer for the question.

     const answers = new Map<any, any>();

   disble(data:any,opton:any,ind:any){
     var gvnAnswer =opton;
     var corrAnswer=this.questionList[this.currentQuestion].answer
     this.answers.set(this.currentQuestion, gvnAnswer);
     if(gvnAnswer==corrAnswer){
       console.log('right answer')
     else{
       console.log('Incorrect answer')
     }
  }
 
  isChecked(option) {
    return this.answers.get(this.currentQuestion) === option;
  }
   <label>
     <input
                type="radio"
                name="fav_language"
                value="{{ option }}"
                [checked]="isChecked(option, i)"
              />{{ option }}</label