Angular Material Radio Button to komponent interfejsu użytkownika służący do wyboru jednej opcji z grupy. W Angular Material przyciski radiowe są tworzone najczęściej za pomocą komponentów mat-radio-button oraz mat-radio-group.
Grupa przycisków radiowych
Przyciski radio powinny być zwykle umieszczane wewnątrz elementu:
<mat-radio-group>
<mat-radio-button value="male">Mężczyzna</mat-radio-button>
<mat-radio-button value="female">Kobieta</mat-radio-button>
</mat-radio-group>
mat-radio-group grupuje opcje i przechowuje informację o aktualnie wybranej wartości. Właściwość value grupy oznacza wartość wybranego przycisku, a nie tekst wszystkich etykiet.
Właściwość labelPosition
Komponent mat-radio-button może mieć etykietę ustawioną przed albo po przycisku. Służy do tego właściwość labelPosition, która przyjmuje dwie podstawowe wartości:
before- etykieta znajduje się przed przyciskiem,after- etykieta znajduje się po przycisku.
Przykład:
<mat-radio-button value="yes" labelPosition="before">
Tak
</mat-radio-button>
Na co uważać na egzaminie?
W pytaniach egzaminacyjnych często trzeba dokładnie odczytać dokumentację. Jeśli dokumentacja mówi, że labelPosition może mieć wartość 'before' albo 'after', to poprawny wniosek brzmi: właściwość przyjmuje jedną z dwóch opcji. Nie należy mylić mat-radio-group z nazwą radio-group ani zakładać, że value przechowuje tekst etykiety.