仅在鼠标移动时进行角度绑定

Question

我有一个非常奇怪的问题。我有一个输入，我只想在输入有值时显示一个按钮。只有当我移动鼠标时它才会起作用。

<input class="form-control"
   type="text"
   placeholder="hello there..."
   #helloInput
>

{{helloInput.value}} --> not shows until mouse is moving

<button class="btn btn-success"
   *ngIf="helloInput.value"
>Show me</button>

这很奇怪。有什么想法吗？

Answer 1

Angular 仅通过调用更改检测来更新视图。大多数情况下，由于 Event listeners/XHR/setTimeout/setInterval 调用，它会自动发生。

在您的示例中，Angular 不知道任何事件侦听器。因为它是由 mousemove 更新的，所以有一些监听器，Angular 检测到了。

为了更新您对任何输入值更改的视图，您只需添加空的input 事件侦听器：

<input class="form-control"
   type="text"
   placeholder="hello there..."
   #helloInput
   (input)="0"  <=============== this one
>