Question

好的，我已经被困在这里一段时间了，我确定这是相对愚蠢的事情

http://plnkr.co/edit/YcBnbE5VCU5rizkDWreS?p=preview

<head>
    <link href="http://twitter.github.com/bootstrap/assets/css/bootstrap.css" rel="stylesheet" type="text/css" />
    <link href="http://twitter.github.com/bootstrap/assets/css/bootstrap-responsive.css" rel="stylesheet" type="text/css" />
    <script src="http://cdnjs.cloudflare.com/ajax/libs/angular.js/1.0.3/angular.min.js"></script>

    <script >
        function myCtrl($scope,  $window) {
            $scope.vm = {};
            $scope.vm.Courses = [
              { Id: 1, Name: "Course 1"},
              { Id: 2, Name: "Course 2"}
              ];
            $scope.OpenCourse = function(courseId) {
                $window.alert("Called " + courseId);
            }
        }
    </script>
</head>
<body ng-controller="myCtrl">
    <div>  
        <div ng-repeat="course in vm.Courses" ng-click="vm.OpenCourse(course.Id)">
            <div>
                <div>
                    <label>{{course.Name}}</label>
                </div>
            </div>
        </div>
    </div>
</body>

为什么不点击这里点击？这个问题似乎被问了很多，但没有一个答案似乎有所帮助。它看起来像重复移动div使它工作，但再次，我不知道为什么。

由于

Answer 1

删除vm.

结果：

<div ng-repeat="course in vm.Courses" ng-click="OpenCourse(course.Id)">

为什么？，因为您设置为$scope的所有内容都可以部分使用，那么您只需要调用它。

Answer 2

在OpenCourse（course.Id）面前缺乏“vm”实际上是我创建plunker时的一个错字。我已经将答案标记为正确，因为它确实导致了攻击者的工作，但我的问题不是这个。事实证明，我有一个分配给外部div的类正在改变z-index，将div放在其他的“后面”，并且不允许点击传播。

Answer 3

如果使用<label>，点击它时可能会遇到奇怪的行为。如果可能的话，尝试将其更改为其他内容并重新测试您的代码。

Answer 4

将其更改为：

ng-click="OpenCourse(course.Id)"

Working plunker

Angular ng-click在div中不起作用

4 个答案: