JQuery Angular2 或更高版本中的等效触发器

Question

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

这是我的代码

 <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;
 }

我想在将文本加载到文本区域时手动触发按键事件此方法 loadQuery(event).

Answer 1

使用带有模板变量的 ViewChild 获取对文本区域的引用，然后使用渲染器调用 dispatchEvent 来触发事件：

 @ViewChild('textarea') textarea:ElementRef;

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

JQuery Angular2 或更高版本中的等效触发器

JQuery Trigger equivalent in Angular2 or higher

keypress

angular