how to activate click event in a dom element (Angular 2)

Question

I need to load a component at loading

<app-main id="tasks" [(ngModel)]="tasks"></app-main>

And the call from js

public tasks;
ngOnInit() {
    this.tasks.click();
}

I have tryed document.getElementById("tasks").click() and ngAfterViewInit()

FAISAL · Accepted Answer · 2017-08-08 09:58:34Z

1

To click the element, you can do the following:

Change your html to following:

<app-main id="tasks" #tasks></app-main>

... then in your component class:

import { Component, ElementRef, ViewChild, AfterViewInit } from '@angular/core';
//...
@ViewChild('tasks') tasks:ElementRef;

ngAfterViewInit () {
    // Fire the click event of tasks
    this.tasks.nativeElement.click();
}

edited Aug 8, 2017 at 9:58

answered Aug 8, 2017 at 9:35

FAISAL

34.8k10 gold badges102 silver badges107 bronze badges

Sign up to request clarification or add additional context in comments.

6 Comments

Ruben Conde Morales Over a year ago

Thanks, but it give "ERROR TypeError: this.tasks is undefined". I'll continue search for another problems that can cause it

FAISAL Over a year ago

yes that is correct behavior. The click method should be called after the view has been initialized. I have updated the answer.

Ruben Conde Morales Over a year ago

it continue failing, I include ElementRef in the constructor and it continues failing

FAISAL Over a year ago

where have you defined @ViewChild('tasks') tasks:ElementRef; in your class ?

FAISAL Over a year ago

create a plunker link with your code please, or add your component class code in the question

|

Collectives™ on Stack Overflow

how to activate click event in a dom element (Angular 2)

1 Answer 1

6 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

6 Comments

Your Answer

Sign up or log in

Post as a guest

Related