<分区>
这应该很简单，但我找不到解决方案，我能在 SO 上找到的最接近的答案是:How do I programmatically set focus to dynamically created FormControl in Angular2
然而，这比我的要求更复杂。我的很简单。我在模板中有这样的输入:
<div *ngIf="someValue">
<input class="form-control" #swiper formControlName="swipe" placeholder="Swipe">
</div>
(注意，它在 ngx-boostrap form-control 组中，但我很确定这不重要)
我有一个按钮，单击它会调用以下函数:
onClick() {
this.renderer.invokeElementMethod(this.swiper.nativeElement, 'focus')
}
目标是单击按钮时，我的输入元素获得焦点。这是我的其余部分(相关部分):
import { Component, ElementRef, ViewChildren, Renderer } from '@angular/core';
import { MyService } from wherever/my/service/is
export class MyClass {
@ViewChildren('swiper') input: ElementRef;
someValue: any = false;
constructor(private renderer: Renderer, service: MyService) {
this.service.getSomeData().subscribe(data => {
this.someValue = true;
}
}
onClick() {
this.renderer.invokeElementMethod(this.swiper.nativeElement, 'focus');
}
}
我得到的错误是:
ERROR TypeError: Cannot read property 'focus' of undefined
at RendererAdapter.invokeElementMethod (core.js:12032)
etc...
有什么想法吗？
( Angular 5 顺便说一下)
请注意，我编辑了代码以更准确地反射(reflect)实际发生的情况，我认为可能存在一些同步问题。