Como manter os dados na tela ao clicar no botão voltar com Angular 8

estou estudando angular ao implementar uma pequena aplicação de questionários me deparei com o seguinte problema. ao clicar no botão voltar, observei que as minhas opções selecionadas sumiam, existe alguma forma de manter essas escolhas salvas na tela ate que eu salve o questionário??

meu HTML

    <div class="content">
        <span class="etapas">Etapa 3 de 4</span>
        <h2>{{pergunta?.dsPergunta}}</h2>
        <p>Escolha até 3 opções</p>
        <div class="box-questoes">
            <ul>
                <li *ngFor="let res of pergunta.respostas" (click)="insereResposta(res.cdResposta)"
                        [ngClass]="respostas?.includes(res.cdResposta) ? 'active' : ''">
                    <p>{{res.dsResposta}}</p>
                    <small>{{res.dsAssunto}}</small>
                </li>
            </ul>
        </div>
        <button (click)="addPergunta()" [routerLink]="[ '/comentario']" class="btn-basico" [disabled]="respostas?.length === 0">Continuar</button>
        <a href="#" (click)="limpaRespostas()" [routerLink]="[ '/forma', cdPergunta, avaliacao]" class="link-bottom">Voltar</a>
    </div>
</div>
<ngx-ui-loader></ngx-ui-loader>

meu TS

import { Component, OnInit } from '@angular/core';
import { ActivatedRoute } from '@angular/router';
import { PesquisaService } from 'src/app/services/pesquisa.service';
import { Pergunta } from 'src/app/models/pergunta';
import { Resposta } from 'src/app/models/resposta';

@Component({
  selector: 'app-questoes',
  templateUrl: './questoes.component.html',
  styleUrls: ['./questoes.component.scss']
})
export class QuestoesComponent implements OnInit {

  avaliacao: number;
  questoes: Resposta[];
  selecionado = false;
  pergunta: Pergunta;
  respostas: number[];

  cdPergunta: number;
  formaResposta: number;

  constructor(private route: ActivatedRoute, private pesquisaService: PesquisaService) {
    this.respostas = [];
    this.avaliacao = parseInt( this.route.snapshot.paramMap.get('avaliacao'));
    this.formaResposta = parseInt(this.route.snapshot.paramMap.get('formaResposta'), 10);

  }

  ngOnInit() {

      this.pesquisaService.getPerguntaResposta(3).subscribe(perguntaResponse => {
        this.pergunta = perguntaResponse;

        if(this.formaResposta == 14){
         this.pergunta.respostas = this.pergunta.respostas.filter(a => a.cdResposta != 12);
        }

        if(this.avaliacao <= 2){
          this.pergunta.dsPergunta = "O que MENOS você gosta?";
        }if(this.avaliacao >= 4){
          this.pergunta.dsPergunta = "O que MAIS você gosta?";

        }
      });
  }

  insereResposta(cdResposta: number) {
    if (this.respostas.includes(cdResposta)) {
      this.respostas.splice(this.respostas.indexOf(cdResposta), 1);
    } else if (this.respostas.length < 3) {
      this.respostas.push(cdResposta);
    }
    console.log(this.respostas);
  }

  addPergunta() {
    this.pesquisaService.addPergunta(this.pergunta.cdPergunta, this.respostas);
  }

  limpaRespostas() {
    this.pesquisaService.limpaRespostas();
  }

}