Angular 2单元测试- @ViewChild未定义
Angular 2单元测试- @ViewChild未定义
提问于 2017-03-11 01:19:43
我正在写一个Angular 2单元测试。我有一个需要在组件初始化后识别的@ViewChild子组件。在本例中，它是来自ng2-bootstrap库的Timepicker组件，尽管细节并不重要。在我detectChanges()之后，子组件实例仍然是未定义的。
伪代码：
@Component({
template: `
<form>
<timepicker
#timepickerChild
[(ngModel)]="myDate">
</timepicker>
</form>
`
})
export class ExampleComponent implements OnInit {
@ViewChild('timepickerChild') timepickerChild: TimepickerComponent;
public myDate = new Date();
}
// Spec
describe('Example Test', () => {
let exampleComponent: ExampleComponent;
let fixture: ComponentFixture<ExampleComponent>;
beforeEach(() => {
TestBed.configureTestingModel({
// ... whatever needs to be configured
});
fixture = TestBed.createComponent(ExampleComponent);
});
it('should recognize a timepicker'. async(() => {
fixture.detectChanges();
const timepickerChild: Timepicker = fixture.componentInstance.timepickerChild;
console.log('timepickerChild', timepickerChild)
}));
});伪代码将按预期工作，直到您到达控制台日志。timepickerChild未定义。为什么会发生这种情况？
回答 4
Stack Overflow用户
发布于 2019-02-27 05:17:21
确保您的子组件没有*ngIf，它的计算结果为false。如果是这样，它将导致子组件是未定义的。
Stack Overflow用户
发布于 2017-08-20 21:50:02
在大多数情况下，只需将其添加到声明中，就可以了。
beforeEach(async(() => {
TestBed
.configureTestingModule({
imports: [],
declarations: [TimepickerComponent],
providers: [],
})
.compileComponents() Stack Overflow用户
发布于 2022-02-03 06:05:18
要了解另一种方法，请参考这篇文章：
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/42724179
复制相关文章
相似问题
腾讯云开发者
