Angular ng-click not working in div

问题

Ok, I've been stuck here for a while, and I'm sure it's something relatively dumb

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>

Why isn't ng-click firing here? It seems that this question is asked a lot, but none of the answers seem to help. It also looks like moving the div out of the repeat makes it work, but again, I'm not sure why.

Thanks

回答1:

Remove vm.

Result:

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

Why?, because everything you set to $scope becomes available on the partial, then you just have to call it.

回答2:

The lack of "vm" in front of OpenCourse(course.Id) was actually a typo on my part when creating the plunker. I've marked an answer as correct, since it did cause the plunker to work, but my problem wasn't this. It turned out that I had a class assigned to outer div that was changing the z-index, putting that div "behind" the others, and not allowing the click to propagate.

回答3:

If you use <label> you might experience weird behaviour when clicking on it. Try changing it to something else if possible and re-test your code.

回答4:

Change it to :

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

Working plunker

来源：https://stackoverflow.com/questions/27512016/angular-ng-click-not-working-in-div

标签

angularjs

angularjs-ng-click