angular 4 只需在 javascript 中设置一个单选按钮答案

【问题标题】：angular 4 simply set a radiobutton in javascriptangular 4 只需在 javascript 中设置一个单选按钮
【发布时间】：2018-03-03 04:49:30
【问题描述】：

这必须很简单，但我不想使用 jQuery。
我需要设置一个特定的单选按钮控件。我有它的Id，所以我尝试了：

let radiobutton = document.getElementById("Standard");
radiobutton.checked = true;

我在网上找到了和上面一样的例子，但 Typescript/Javascript 给了我错误信息： ““HTMLElement”类型上不存在“已检查”属性”

有什么想法吗？

感谢您的帮助。

【问题讨论】：

为什么不使用 Angular 绑定？
这不是在 Angular2 中做事的正确方法。但是找w3schools.com/jsref/met_element_setattribute.asp
我可以使用一些帮助来帮助我在 Angular 中“做对”。尽管我一直在阅读有关绑定的内容，但我不了解绑定，它并没有陷入困境。您能说更多吗？
我尝试使用 setattribute 像：document.getElementsByTagName("cs-input-radio")[0].setAttribute("checked", "true");但它不起作用......我设置了错误的属性吗？

标签： javascript angular typescript radio-button checked

【解决方案1】：

不要使用 document.getElementById，而是使用 @ViewChild 和模板变量。这是一个例子：

HTML：

<input #checkbox1 type="checkbox" [checked]="true" (change)="onChange(1, checkbox1)"/>{{name1}}
<br>
<input #checkbox2 type="checkbox" (change)="onChange(2, checkbox2)"/>{{name2}}

打字稿：

  name1 = 'Angular 2';
  name2 = 'Angular 4';

  @ViewChild("input1") input1;
  @ViewChild("input2") input2;

  ngOnInit(){
    this.input1.checked = true;
    console.log("Checkbox1 is checked -  ", this.input1.checked);
    console.log("Checkbox2 is checked -  ", this.input2.checked);

  }

  onChange(checkbox, item){
    console.log("Checkbox%d was checked", checkbox);
    console.log("Checkbox%d is checked -  ",checkbox, item.checked);

  }

Stackblitz example

【讨论】：