javascript – Angular：在没有jQuery的情况下点击并清空一个表单字段？

我有一个表单输入,我想模糊(去焦点),并在单击按钮时清空.

在AngularJS中,我在控制器中这样做：

angular.element('#search-input').val('');
angular.element('#search-input').blur();

在Angular(4.4.4)中我有这样的工作方式：

$('#search-input').val('');
$('#search-input').blur();

但我宁愿不使用jQuery.在Angular中这样做的正确方法是什么？

这是整个组件：

import { Component,OnInit } from '@angular/core';

@Component({
  selector: 'pb-header',templateUrl: './header.component.html'
})
export class HeaderComponent implements OnInit {

  private searchActive: boolean;

  constructor() {
    this.searchActive = false;
  }

  ngOnInit() {
  }

  toggleSearch = function () {
    if (this.searchActive) {
      this.searchActive = false;
      $('#search-input').val('');
      $('#search-input').blur();
    } else {
      this.searchActive = true;
    }

  };

}

解决方法

您可以使用NgForms重置方法：

@ViewChild(NgForm)
public form:NgForm;


form.reset(<value>);

此外,不需要模糊,因为您单击按钮并将获得焦点,如果没有,则设置按钮的tabindex属性.