Aurelia 单选按钮绑定

Question

希望有人能帮我解决这个问题。我有以下观点：

<label repeat.for="option of options">
    <input type="radio" name="periodOptions" model.bind="option" checked.bind="$parent.selectedOption" click.delegate="clicked()"/>
    ${option.text}
</label>

和以下视图模型：

export class PeriodPanel {
    heading = 'Tidsperiode';
    options = [];
    selectedOption = {};

    constructor() {
        this.options = [
            {id:1, text:'Vis med dagoppløsning'}, 
            {id:2, text:'Vis med timeoppløsning'}, 
            {id:3, text:'Vis periode'}
        ]; 
        this.selectedOption = this.options[0];
    }

    clicked() {
        console.log(this.selectedOption.id);
    }
}

分配 this.selectedOption = this.options[0]; 的原因是为了确保初始设置其中一个单选按钮。这一切都很好，但当我依次单击每个单选按钮时，selectedOption 变量的值不会改变，单击处理程序 clicked() 每次都会打印值 1。我究竟做错了什么？

TIA

Answer 1

Return true 从您的 clicked() 方法允许事件传播。

这是一个工作示例：

https://gist.run/?id=84eb0949ff63c3f10a1eff3c337f2c97

Aurelia 单选按钮绑定

Aurelia radio button binding

javascript

aurelia