大佬教程收集整理的这篇文章主要介绍了如何在角度6中测试模板驱动的表格，大佬教程大佬觉得挺不错的，现在分享给大家，也给大家做个参考。
<form #form="ngForm" (ngSubmit)="onSubmit()">
<input class="form-control input-lg" id="venue_name" name="venue_name" type="text" #venue_name="ngModel"
[(ngModel)]="tournament.venue.venue_name" required>
<input id="address" name="address" placeholder="search for location" required #address="ngModel"
type="text" class="form-control input-lg" #search [(ngModel)]="tournament.venue.address">
</form>
在我的组件中,我有：
@ViewChild(NgForm) ngForm: NgForm;
在我的测试中,我有：
fixture = TestBed.createComponent(TournamentEditVenueComponent); comp = fixture.componentInstance; form = comp.ngForm.form; console.log(form);
我可以在Chrome控制台中看到：
FormGroup {venue_name: FormControl,address: FormControl,details: FormControl,country_id: FormControl}
所以表格似乎是可以达到的
但当我试图与它达成时
console.log(form.controls);
要么
console.log(form.controls['venue_name']);
第一个是空的,第二个是未定义的.
为什么？我应该怎么做？
对于解决方案,一旦完成设置,您似乎不会调用fixture.detectChanges(),这在测试中需要设置数据绑定.更多信息：https://angular.io/guide/testing
一旦根据这个答案Trying to unit test template-based form in a component,form has no controls完成这个,它解释说他们修复它然后也确保夹具稳定 –
如果您尝试访问此处的表单控件,那么它将在下面的示例中工作.
fixture = TestBed.createComponent(TournamentEditVenueComponent);
comp = fixture.componentInstance;
fixture.detectChanges();
fixture.whenStable().then( () => {
console.log(comp.ngForm.controls['venue_name'])
component.ngForm.controls['venue_name].setValue('test_venue');
})
希望这可以帮助.
以上是大佬教程为你收集整理的如何在角度6中测试模板驱动的表格全部内容，希望文章能够帮你解决如何在角度6中测试模板驱动的表格所遇到的程序开发问题。
如果觉得大佬教程网站内容还不错，欢迎将大佬教程推荐给程序员好友。
本图文内容来源于网友网络收集整理提供，作为学习参考使用，版权属于原作者。
如您有任何意见或建议可联系处理。小编QQ：384754419，请注明来意。