Angular2-单选按钮测试

我正在尝试用Angular 2中的Karma Jasmine测试一个HTML单选按钮。 我的HTML代码是这样的

<label class="color-dark display-block" *ngFor="let userGroup of userGroups">
    <input type="radio" id="stateRadio" name="statusRadio(click)="selectedGroup(seGrp = statusLabel.value)" [checked]="statusLabel.value === selectionStatus">{{statusLabel.value}}
</label>

我得到一个错误-TypeError:null不是一个对象（计算'fixture.debugElement.query（platform_browser_1.By.css（'#stateRadio'））.nativeElement'））

---

在spec中，el类型是HtmleElement，我的id是By.css（），因为css类color dark display block对于其他输入类型也是通用的。如何解决此问题？

如果看不到组件的逻辑，我必须猜测userGroups数组是空的或未定义的，因此没有呈现任何内容，因此：

fixture.debugElement.query(By.css('#stateRadio'))

---

返回null。

id属性必须是唯一的。要使for循环中的id唯一，请执行以下操作：

更改：

*ngFor="let userGroup of userGroups" 

致：

还有变化：

id="stateRadio"    

对这样的事情：

id="stateRadio[{{i}}]"

---

HTML元素id应该是唯一的，仅供参考。@AluanHaddad是的。但是我的方法不起作用。我是说，

id=“stateRadio”

它不是一个可靠的选择器，因为它是在

*ngFor

中创建的。有什么替代方法？有很多替代方法，请记住这可能不是问题的原因，但您仍然应该修复它。基本上，您可以生成ID，或者使用另一种选择器，例如element.class。生成ID可能会有问题，因为测试可能会与代码不同步。

id="stateRadio"    

id="stateRadio[{{i}}]"