如何触发点击组件中的HTML文件元素? (角2) [英] How to trigger click on an HTML file element from a component ? (Angular 2)

查看:116
本文介绍了如何触发点击组件中的HTML文件元素? (角2)的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

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

我对Angular 2非常新颖,问题在于如何触发单击组件中的HTML文件元素? rankingFilter(){

this.RepsloaderShow = true;
this.reps = [];
var data = {
from:this.fromFilter,
to:this.toFilter,
user_search:this.user_search
}
this.http。 ((数据)=> {
这个数据) .reps = data;
this.RepsloaderShow = false;
//触发器点击此处

});
}

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文件(单击class ='rep'上的事件)

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>


推荐答案

从主机元素派发

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

这篇关于如何触发点击组件中的HTML文件元素? (角2)的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆