Angular2 - Textarea验证如何强制模糊

Question

我的表单是通过Enter键提交的.该值textarea的是空的,因为焦点仍然在textarea的.

有没有办法强制在textarea上模糊,还是有更优雅的方法？

Answer 1

要模糊DOM表单元素,请将本地模板变量与@ViewChild结合使用,以获得对textarea的"Angular wrapped"引用.然后在使用nativeElement解包后使用渲染器模糊:

@Component({
  selector: 'my-app',
  template: `
    <form>
      <textarea #textArea [(ngModel)]="text" (keyup.enter)="submit()"></textarea>
    </form>
  `
})
export class AppComponent {
  text = "";
  constructor(private renderer:Renderer) { console.clear(); }
  @ViewChild('textArea') textArea:ElementRef;
  submit() {
    this.renderer.invokeElementMethod(
      this.textArea.nativeElement, 'blur', []);
  }
}

Plunker