Angular 4 wie kann ich trigger change wie jquery trigger ('change')

Question

Ich versuche eine Änderung in Winkel 4 für Eingabefeld nach dem Wert in es durch this.my_var = my_val auslösen, und dann, wie kann ich Change Event auslösen?

Code-

import { Component, OnInit,OnDestroy, Renderer, ElementRef, ViewChild } from '@angular/core'; 
 
@ViewChild('mka_gb') mka_gb:ElementRef; 
 
    
 
constructor(private router: Router, private renderer:Renderer) { } 
 

 
    ngOnInit() { 
 
    this.getOverviewData(); 
 
    let search = window.localStorage.getItem('search_val'); 
 
    window.localStorage.setItem('search_val', ''); 
 
    console.log(search); 
 
    if(search != '') { 
 
     setTimeout(()=>{ 
 
     this.mka_search = search; 
 
     let event = new MouseEvent('click', {bubbles: true}); 
 
     this.renderer.invokeElementMethod(
 
     this.mka_gb.nativeElement, 'dispatchEvent', [event]); 
 
     },300); 
 
     
 
    } 
 
    }

<input #mka_gb type="text" pInputText size="50" placeholder="Global Filter" class="form-control" [ngModel]="mka_search">

Answer 1

ich die Lösung für das Problem gefunden:

setTimeout(()=>{ 
 
    $('.any_class')[0].dispatchEvent(new Event("change")); 
 
},3000);

Answer 2

können Sie ViewChild verwenden:

import { Component, Renderer, ElementRef, ViewChild } from '@angular/core'; 
@Component({ 
    ... 
    template: ` 
... 
<input #fileInput type="file" id="imgFile" (click)="onChange($event)" > 
...` 
}) 
class MyComponent { 
    @ViewChild('fileInput') fileInput:ElementRef; 

    constructor(private renderer:Renderer) {} 

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