Angular 仅在鼠标移动时绑定

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 仅通过调用更改检测来更新视图。大多数时候它会自动发生，因为事件 listeners/XHR/setTimeout/setInterval 调用。

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

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

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

Angular 仅在鼠标移动时绑定

Angular bind only when mouse moves

javascript

data-binding

typescript

angular