时间戳

首页 > 解决方案 > 从常规 JavaScript 触发角度元素事件

javascript - 从常规 JavaScript 触发角度元素事件

问题描述

我正在尝试自动填充使用 Angular 编写的页面，我将其加载到我的应用程序的 web 视图中。

页面中有一个元素，其语法如下：

<input id="element" ng-model="model" ng-blur="onInput('input')">

现在，我通过注入 JS 将数据从我的应用程序填充到字段中。

document.getElementById("element").value = "myvalue"

但是，ng-blur 事件没有触发。如果我在它触发的字段中手动输入数据。如何触发 ng-blur 事件？

我试过onblur在元素上调用常规处理程序，但它是null. 还尝试过这样的评估：

let elem = document.getElementById("element")
eval(elem.attributes["ng-blur"])

但这也失败了，因为范围错误。如何从常规 JavaScript 触发角度事件？

标签： javascriptangularandroid-webview

解决方案

当元素失去焦点时会触发模糊，因此当您单击外部时。更改输入的值不会触发此事件。

在这里，您可以像这样使用 ngModelChange：

<input id="element" [(ngModel)]="model" (ngModelChange)="onInput($event)">

ngModelChange 非常明确，当 ngModel 值更改时会触发它

此外，我不确定使用不带括号和括号的 ngModel 是否有效，但也许这是我不知道的语法。

最后一件事：在角度中，您可以使用“ViewChild”获得元素

只需像这样对元素进行引用：

<input id="element" #someInput [(ngModel)]="model" (ngModelChange)="onInput($event)">

然后在您的打字稿中，您需要导入 ViewChild

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

并像这样使用它：

export class AppComponent implements AfterViewInit {
   @ViewChild('someInput') someInput: Any;
   ngAfterViewInit() {
      this.someInput.value = 'Hey';
   }
 }

推荐阅读