触发点击控制器中ng-repeat中第一个元素的第一个元素

Question

嗨，我需要在第一个元素中触发点击 #first > #second > #third > .element-for-trigger-click ， 看这里

<div id="first" ng-repeat="competition in prematchGameViewData track by competition.id">
    <div id="header">...</div>
    <div id="details">...</div>


    <div id="second" ng-repeat="(groupDate, groupGames) in competition.gamesGroupedByDate">     
        <div id="third" ng-repeat="prematchGame in groupGames track by prematchGame.id">
            <div class="element-for-trigger-click"></div>
            ...
        </div>
    </div>
</div>

问题： 我如何从左控制器获取事件，找到 .element-for-trigger-click 并使用本机 js 触发右控制器的点击。

Answer 1

阿罗，

所以在以下线程中，您可以找到如何通过本地 JS 在给定元素上“模拟”点击事件的信息（通过 id 很难）

How to simulate a click with JavaScript?

但是我真的不推荐这种方法，尤其是如果您使用 angularJS，因为有一些方法可以与 angular lib 本身进行控制器到控制器的通信，例如：

• 使用 Angular 事件总线（$emit、$broadcast 和 $on）
• 使用服务
• 使用状态容器的模式，如 redux (https://github.com/reactjs/redux)
• 可能还有更多。

Answer 2

您可以通过以下方式发送点击事件：

var evt = document.createEvent("MouseEvents");
evt.initMouseEvent("click", true, true, window, 1, 0, 0, 0, 0,
    false, false, false, false, 0, null);

var target = document.getElementById('third').firstChild;
target.dispatchEvent(evt);

顺便说一句，如果您只是像所有其他元素一样为该元素提供一个 ID，您就不必使用 .firstChild。