Javascript 事件处理程序停止在Angular Controller中工作

在我的一个角度控制器中有下面一行。每次加载初始页面时，事件处理程序都会激发，但当导航到不同的项目时，即使它们使用相同的控制器和模板，事件处理程序也会停止工作

        document.getElementById('item-details-view').addEventListener('touchstart', toggleshowoption, false);

更新：

尝试使用此指令：

app.directive('slideShowMenu', function () {
return {
    link: function ($scope, $element, $attrs) {

        var visible = false;

        function toggleshowoption() {
            if (!visible) {
                $(".slideshow-controls").css({"visibility": "visible", "opacity": "1"});
                visible = true;
            }
            else {
                $(".slideshow-controls").css({"visibility": "hidden", "opacity": "0"});
                visible = false;
            }
        }
        $element.addEventListener('touchstart', toggleshowoption, false);
    }
}
});

这给了我以下错误：

undefined is not a function (evaluating '$element.addEventListener('touchstart', toggleshowoption, false)')

---

元素id必须是唯一的-我怀疑需要第二次呈现模板，从而创建两个具有相同id的元素。也许改用类会有所帮助。

谢谢您的建议。使用getelementsbyclass…也有同样的问题…在页面加载时有效，而不是在导航后。您能提供一个提琴吗？您是否尝试在指令中而不是在角度工作流之外添加事件？项目详细信息视图更改或重新创建？如果您更改destroy或重新创建item details视图，您必须读取eventListener，您可以将此事件添加到all的全局范围。item details视图这样，即使更改，事件也会在所有页面中触发，或者使用jquery。在我看来angularjs使用jqueryNicearma的精简版本-模板保持不变，但内容发生了变化…所以可能会被销毁并重新制作。