Javascript 搜索时禁用输入字段并将焦点设置为完成

我有一个输入字段，在键入时，我希望搜索项目，并在后台执行搜索时禁用文本字段，这样就没有更多的字母可以在该输入中键入，但在完成搜索功能后，重点应该是搜索输入字段，以便用户可以开始键入

Html:

<input [disabled]="(displayLoader > 0)" [ngModel]="''" (ngModelChange)="updateData($event)" class="form-control-search" placeholder="Search"/>

updateData(event) {
   this.displayLoader = 1
   //search function
   //on completion
   this.displayLoader = 0; 
}

---

在这里，我使用了disabled，但在完成时，它不会聚焦输入字段，并且在用户手动单击输入字段之前也无法键入。

尝试此代码。这有帮助吗。 html

<input [disabled]="(displayLoader > 0)" [ngModel]="''" #focusable (ngModelChange)="updateData($event,focusable)" class="form-control-search" placeholder="Search"/>

---

您是否试图在通过服务调用获取搜索数据时禁用输入字段？根据他的描述，他希望在后端执行搜索时禁用文本框，并在完成时禁用文本框focus@Abrar作为一个不熟悉typescript的人，我不清楚为什么需要添加标记。请您澄清一下，这里使用的是TypeScript独有的、JavaScript不可用的功能？是什么使这个示例与更普通的Angular on JS配置不兼容？是的，正如@SandipPatel所说，我想在后台数据获取时禁用搜索字段。感谢所有人的回复，Focus与angular2 Focus正常工作。在这里，我想集中和禁用一起，这是不工作的这一个我已经尝试过，但该重点是不能正常工作。例如，我们必须手动单击该输入字段才能开始键入。聚焦到同一个元素不起作用，请看这里可能会有所帮助，谢谢，伙计，聚焦与angular2聚焦一起正常工作。在这里，我希望焦点和残疾人一起，这是不工作的。残疾人似乎已经为我工作，但我不能键入反正之后。

 updateData(event,el) {
       this.displayLoader = 1
       //search function
       //on completion
       this.displayLoader = 0; 
    el.focus();
    }