如何使基于条件的单选按钮被选中？

Question

我想在基于条件的基础上检查单选按钮。就像index=>4时，应该检查按钮4。我的HTML代码是这样的：

<input id="rating5" type="radio" name="rating" value="5"> 
<label for="rating5">5</label> 
<input id="rating4" type="radio" name="rating" value="4"> 
<label for="rating4">4</label> 
<input id="rating3" type="radio" name="rating" value="3"> 
<label for="rating3">3</label> 
<input id="rating2" type="radio" name="rating" value="2" > 
<label for="rating2">2</label> 
<input id="rating1" type="radio" name="rating" value="1"> 
<label for="rating1">1</label> 

Answer 1

不知道哪里index从何而来，但假设它是服务器端，你可以把一个PHP if语句权这样的输入标签内。

<input id="rating4" <?php if ($index >=4){echo 'checked="checked"';} ?> 
type="radio" name="rating" value="4"> 

Answer 2

我有这样的工作在我的项目。诀窍是将checked属性绑定到布尔表达式。

HTML

<input id="rating4" type="radio" name="Rating" [checked]="index == 4" (click)="index = 4"> 
<label for="rating4">4</lable> 

JS

@Component({ 
    . 
    . 
    . 
}) 
export class MyClass { 
    index: number; 

    constructor() { 
    this.index = 4; 
    } 

} 

基本上如果索引等于匹配的值，并点击该单选按钮更新的单选按钮将被检查它我组件。在这个例子中，我们默认所选按钮为4，但如果您不想选择任何内容，则可以将其默认为-1。