Angular2 或更高版本中的 JQuery Trigger 等效项

Question

大家好，因为我知道 JQuery 中用于手动触发事件的 trigger() 方法，我想知道 Angular2 或更高版本中是否有任何等效方法。最近我有一个 textarea ，现在每当变量的值从 typescript 更改时，我想触发 textarea 的 keypress 事件，在其中绑定一个文本变量。

这是我的代码

 <textarea  rows="3" id='myInputText'  class="form-control textareaPage" 
  name="businessQuery" [(ngModel)]="text" #textarea (input)="addTags(); getContectualHelp()" #queryEditor="ngModel" taxonomyValidate ngModel required [attr.arrayIncludes]="listOfTaxonomy" placeholder="Please type query to search" style="border-radius: 0; min-height:70px;"> </textarea>

在textarea中加载文本的方法如下

 loadQuery(event) {
 this.text = event.target.innerText;
 }

我想在将文本加载到 textarea 时手动触发按键事件 这个方法 loadQuery(event)。

Answer 1

使用 ViewChild 和模板变量来获取对 textarea 的引用，然后使用 Renderer 调用 dispatchEvent 来触发事件：

 @ViewChild('textarea') textarea:ElementRef;

loadQuery() {
 let event = new MouseEvent('click', {bubbles: true});
 this.renderer.invokeElementMethod(this.textarea.nativeElement, 'dispatchEvent', [event]);
 }