在Angular Material中,可以通过使用[(ngModel)]
来传递值给单选按钮组。以下是一个示例:
在组件的HTML模板中:
Option 1
Option 2
Option 3
在组件的TypeScript文件中:
import { Component } from '@angular/core';
@Component({
selector: 'app-radio-button-example',
templateUrl: './radio-button-example.component.html',
styleUrls: ['./radio-button-example.component.css']
})
export class RadioButtonExampleComponent {
selectedOption: string;
constructor() {
// 初始化选中的值
this.selectedOption = 'option1';
}
}
在上面的示例中,我们使用[(ngModel)]
来绑定selectedOption
变量和单选按钮组。通过设置value
属性,我们可以为每个单选按钮指定一个值。在组件的构造函数中,我们将selectedOption
初始化为"option1",这将使第一个单选按钮默认选中。
这样,当用户选择不同的单选按钮时,selectedOption
变量的值将相应地更新。您可以在组件中使用selectedOption
变量来处理所选选项的逻辑。