Я хочу передавать данные из HTML в компонент, поэтому я'создал такое событие:
<div id="tutor-price" (click)="passCharge(r.value['charge'])"><span id="month">월 8회</span> <span id="price"> {{r.value['charge']}} </span></div>
А в компоненте:
passCharge(charge){
this.charge = charge;
console.log(this.charge,"give me the number")
}
Если я нажимаю на событие, я вижу, что все работает нормально. Но я хочу, чтобы событие щелчка срабатывало автоматически, так как я хочу, чтобы компонент использовал значение 'this.charge' сразу после загрузки компонента.
Могу ли я как-то автоматически вызвать событие (click)?
Дайте ему ссылку на ViewChild:
<div #myDiv id="tutor-price" (click)="passCharge(r.value['charge'])"><span id="month">월 8회</span> <span id="price"> {{r.value['charge']}} </span></div>
В вашем компоненте:
@ViewChild('myDiv') myDiv: ElementRef<HTMLElement>;
triggerFalseClick() {
let el: HTMLElement = this.myDiv.nativeElement;
el.click();
}
Вы можете запустить событие щелчка в ngOnInit() следующим образом: `
<div #divClick id="tutor-price" (click)="passCharge(r.value['charge'])">
<span id="month">월 8회</span>
<span id="price"> {{r.value['charge']}} </span>
</div>`
В файле component.ts
import { Component, OnInit, AfterViewInit, ElementRef, ViewChild } from '@angular/core';
@Component({
//component decoraters
})
export class MyComponent implements OnInit, AfterViewInit {
@ViewChild('divClick') divClick: ElementRef;
ngOnInit() {
// your other code
setTimeout(() => {
this.divClick.nativeElement.click();
}, 200);
}
}
<div #tutor id="tutor-price" (click)="passCharge(tutor.value['charge'])"><span id="month">월 8회</span> <span id="price"> {{tutor.value['charge']}} </span></div>
Надеюсь, это поможет вам.
import { Component, OnInit } from '@angular/core';
tutor:any;
@Component({
//your component decorater tags
})
export class MyComponent implements OnInit{
ngOnInit(){
this.charge = this.tutor.value['charge'];
}
passCharge(charge){
this.charge = charge;
}