Angular - Check if all options are selected to enable button

Question

This is a quiz app, in this scenario my next button will redirect to another page and it's disabled by default. If I choose all the options it should enable.

NOTE:

My functionality of selecting options and choosing correct/wrong is working fine, I just can't figure out how to enable when each single option is selected.

Any help or suggestions? Working demo: https://stackblitz.com/edit/angular-ivy-5qtyxy

buttonDisabled = true;

<button class="btn-next" [disabled]="buttonDisabled">
  Next
</button>

Answer 1

My take on this is to define the buttonDisabled as a getter and then evaluate for each question if it's status allows for the navigation to the next page...

In my implementation the user has to select all of the answers of the type-2-questions, but only one answer on the type-1-questions. If this is not what you want please state so in the comments, it's just what appeared logical to me. I hope it helps you already.

Any questions? Just ask.

Here's my stackblitz