角度单选按钮的动态列表

cod*_*bot 5 radio-button angular angular6

我有一个不属于表单的单选按钮列表。我想根据一个值将其中一个设置为 true。

然后,当另一个人被点击时,除了被点击的那个之外,所有其他人都被设置为 false。

单选按钮列表是动态的,由 a ngFor,

我有类似的东西

<div *ngFor='let item of array;let i = index'>                    
   <input type="radio" [checked]=false (click)='radioChecked(item.id,i)' > <input type="text" value='{{item.name}}' >  <button type="button" >save</button>                    
 </div>  

ngOnInit() {  
  this.myService.getNumber(id).subscribe((data) =>{  
  //when the page loads, set one of radiobuttons to true
  //somehow get the id and set to true, no standard is, since dynamic list
  radioId.value = true;
  })
}

radioChecked(id, i){
  //turn all the others to false, except this one
}
Run Code Online (Sandbox Code Playgroud)

由于这不是表单并且没有标准行,所以我可以有一个 id,我该怎么做?我使用角度 6

谢谢

Sur*_*iya 5

selected 属性应该是数组中 item 对象的一部分。

模板:

    <div *ngFor='let item of array;let i = index'>                    
       <input type="radio" [checked]="item.selected" (change)='radioChecked(item.id,i)' > 
        <input type="text" value='{{item.name}}'/>  
        <button type="button">save</button>                    
     </div> 
Run Code Online (Sandbox Code Playgroud)

成分:

 radioChecked(id, i){
  array.forEach(item=>{
    if(item.id !== id){ 
       item.selected = false;
    }else{
       item.selected = true;
    } 
  })
}
Run Code Online (Sandbox Code Playgroud)