<\/span><\/h3>\nTo get the selected radio-button value in Angular Material, you can utilize the two-way data binding feature provided by Angular. This allows you to bind the value of the radio button to a variable in your component’s code. Here’s a step-by-step guide on how to achieve this:<\/p>\n
1. Start by importing the necessary Angular Material modules in your component file. For radio buttons, you will need to import the `MatRadioModule` module.<\/p>\n
2. Declare a variable in your component’s code to store the selected value. For example, you can define a variable called `selectedValue` and set it to an initial value.<\/p>\n
3. In your component’s template, use the `mat-radio-group` directive to group your radio buttons. Bind the `value` property of each radio button to the desired value. Add the `[(ngModel)]` directive to bind the selected value to the `selectedValue` variable.<\/p>\n
“`html
\n
\n Option 1<\/mat-radio-button>
\n Option 2<\/mat-radio-button>
\n Option 3<\/mat-radio-button>
\n <\/mat-radio-group>
\n “`<\/p>\n4. Finally, you can access the selected value by referencing the `selectedValue` variable in your component’s code, such as in a button click event handler or any other method where you need the value.<\/p>\n
“`typescript
\n \/\/ Component code
\n selectedValue: string = ‘option1’; \/\/ Initial value<\/p>\n
\/\/ Method to get the selected value
\n getSelectedValue() {
\n console.log(this.selectedValue);
\n }
\n “`<\/p>\n
By following these steps, you can easily obtain the selected radio-button value in Angular Material. Remember to adjust the variable names and values to fit your specific use case.<\/p>\n