How to trigger click on an HTML file element from a component ? (Angular 2)

Question

I am very new to Angular 2 the question is How to trigger click on an HTML file element from a component?

  rankingFilter() {

    this.RepsloaderShow = true;
    this.reps = [];
    var data = {
        from: this.fromFilter,
        to: this.toFilter,
        user_search: this.user_search
    }
    this.http.post(CONSTANTS.baseApiUrl + 'reports/rankings_individuals', data)
        .map(res => res.json())
        .subscribe((data) => {
            this.reps = data;
            this.RepsloaderShow = false;
            // Trigger click here

        });
}

HTML File (click event on class='rep')

    <ul class="carousel-indicators section-nav">
        <li class=" icon_0 icon active rep" data-target="#slideable" data-slide-to="0">
            <span class='shh'>Reps</span>
            <p style="display: none;">Reps</p>
        </li>
        <li class="icon_0 icon team" data-target="#slideable" data-slide-to="1">
            <span class='shh'>Teams</span>
            <p style="display: none;">Teams</p>
        </li>
        <li class="icon_0 icon award" data-target="#slideable" data-slide-to="2">
            <span class='shh'>Class Ranks</span>
            <p style="display: none;">Class Ranks</p>
        </li>
    </ul>

From which element, and for what purpose? One example is shown in stackoverflow.com/questions/36342890/… — Günter Zöchbauer
– Günter Zöchbauer, Commented Oct 18, 2016 at 8:59

Günter Zöchbauer · Accepted Answer · 2016-10-18 09:01:36Z

6

For dispatching from the host element

constructor(private elRef:ElementRef, private renderer:Renderer) {}

For dispatching from an element inside the template

<some-elem #target></some-element>

@ViewChild('target') elRef:ElementRef;

And then dispatch the event:

  ...
    this.renderer.invokeElementMethod(this.elRef.nativeElement, 
        'dispatchEvent', 
        [new MouseEvent('click', { bubbles: true, cancelable: true })]);

answered Oct 18, 2016 at 9:01

Günter Zöchbauer

661k235 gold badges2.1k silver badges1.6k bronze badges

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

Collectives™ on Stack Overflow

How to trigger click on an HTML file element from a component ? (Angular 2)

1 Answer 1

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related