我正在为一个指令编写测试，但我无法使用 By.directive(IsRouteDirective) 查询指令宿主元素以工作.控制台日志记录 hostElement总是产生 null .
在下面的代码中，LibRouteComponent和 LibTestComponent只是带有空模板的虚拟组件。
这是指令(简短版):
@Directive({
selector: '[libIsRoute]'
})
export class IsRouteDirective implements OnInit { ... }
这是它的测试设置:
describe('IsRouteDirective', () => {
let directive: IsRouteDirective;
let fixture: ComponentFixture<LibTestComponent>;
let hostElement;
beforeEach(() => {
fixture = TestBed.configureTestingModule({
imports: [
LibTestModule,
RouterTestingModule.withRoutes([
{
path: '',
pathMatch: 'full',
redirectTo: 'foo'
},
{
path: 'foo',
component: LibRouteComponent
},
{
path: 'bar',
component: LibRouteComponent
}
])
],
declarations: [IsRouteDirective]
})
.overrideComponent(LibTestComponent, {
set: {
template: `
<router-outlet></router-outlet>
<div [libIsRoute]="['foo']"></div>
`
}
})
.createComponent(LibTestComponent);
fixture.detectChanges();
hostElement = fixture.debugElement.query(By.directive(IsRouteDirective));
console.log(hostElement);
directive = hostElement.injector.get(IsRouteDirective);
});
it('should be defined', () => {
expect(hostElement).toBeTruthy();
});
});
使用 By.css('div')给出 DebugElement{nativeNode: <div libisroute=""></div>....在日志中显示该元素存在并且在其上设置了指令选择器。
我正在做官方文档正在做的事情 here .
为什么不 By.directive(IsRouteDirective)适合我的情况吗？
最佳答案
解决方法
fixture.debugElement.query(By.directive(IsRouteDirective)).injector.get(IsRouteDirective)
关于Angular - fixture.debugElement.query(By.directive(IsRouteDirective) 找不到宿主元素，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/56166222/