ng-click in 指令在 IE 中不起作用，但在 Chrome 中起作用答案

【问题标题】：ng-click in directive doesn't work in IE but works in Chromeng-click in 指令在 IE 中不起作用，但在 Chrome 中起作用
【发布时间】：2014-12-04 16:45:17
【问题描述】：

我不确定这是否是一个已知的错误（甚至是一个错误......），但我在角度问题列表中找不到它，也许我做错了什么：

.directive('clickTest', function () {
    return {
        transclude: true,
        template: '<div ng-click="click()" style="width:200px; height:200px;">Click me<div ng-transclude></div></div> Clicked {{clicked}} times',
        controller: function($scope, $element){
            $scope.clicked = 0;
            $scope.click = function() {
                $scope.clicked++;
            }
        }
    }

所以我基本上已经将指令添加到我页面上的一个元素中。该指令在模板中有一个 ng-click 处理程序并包含现有元素。 ng-click 运行 click() 函数，该函数应该触发对当前范围的点击。

在 Chrome 中，当我单击按钮时，计数器会增加 1。

如果我在 IE11 中做同样的事情 什么都不会发生。我一直在努力让它工作一段时间，因为我的大多数目标受众都将使用 IE

我认为这应该可行 - 据我所知，angular 应该在嵌入后编译模板以识别它需要使用的任何进一步的指令

我是不是做错了什么，或者这个点击应该起作用吗？

【问题讨论】：

您的代码在 IE11 中对我来说是 works。也许问题出在为了创建发布的最小示例而删除的代码中。或者，嵌入的元素可能会干扰点击。发布您的标记也可能会有所帮助。
如果您将 click-test 指令放在 button 元素上，则会遇到 OP 描述的相同情况。 IE11 中的点击事件处理可能不一致？
是的，当我上床睡觉时，我意识到这可能是因为我正在将属性添加到按钮元素。当我意识到这只是一个 IE 怪癖时，我可能会尝试将它包装在一个 div 中并更新！

标签： angularjs angularjs-directive

【解决方案1】：

知道这是我做错的事情 - 正如评论者所说，这是因为我试图将指令添加到 <button> 元素。

我将元素包装在 <div> 中，并将指令应用于该元素，它可以工作！

【讨论】：