Question

我使用angular2（beta 17）的复选框有一个奇怪的问题。

我正在尝试设置相同的复选框，因为元素具有数组并绑定更改或单击事件。

例如我有一个数组：

myObjects=[
    {value:true},
    {value:true},
    {value:false},
    {value:true}
];

我正在使用ngFor创建所有复选框：

<div *ngFor="let myObject of myObjects; let i = index" >
    <input 
            type="checkbox" 
            [checked]="myObject.value" 
            (change)="updateCheckedOptions(i, $event)"
    />
</div>

最后我的组件中有一个函数：

@Input() myObjects;

updateCheckedOptions(index,event){
    this.myObjects[index].value=event.target.checked;
}

但问题是复选框没有改变，我的意思是当我点击复选框时，如果选中初始状态，则始终保持选中状态，反之亦然。

我尝试过使用（点击），（更改），[（ngModel）]，但它不起作用。

谢谢！

Answer 1

您可以检查ngModelChange：

＆＃13;

//This is your component

@Input() myObjects;

myObjects=[
    {value:true},
    {value:true},
    {value:false},
    {value:true}
];

updateCheckedOptions(index,event){
    this.myObjects[index].value=event.target.checked;
    console.log(index + " ---- " + event);
}

＆＃13;

<div *ngFor="let myObject of myObjects; let i = index" >
    <input 
            type="checkbox" 
            [checked]="myObject.value" 
            (ngModelChange)="updateCheckedOptions(i, $event)"
    />
</div>

＆＃13;

绑定点击并更改复选框angular2

1 个答案: