Angular ng-click не работает в div

Хорошо, я застрял здесь некоторое время, и я уверен, что это что-то относительно немое

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

<head>
    <link href="#" onclick="location.href='http://twitter.github.com/bootstrap/assets/css/bootstrap.css'; return false;" rel="stylesheet" type="text/css" />
    <link href="#" onclick="location.href='http://twitter.github.com/bootstrap/assets/css/bootstrap-responsive.css'; return false;" 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>

Почему здесь нет стрельбы ng-click? Кажется, что этот вопрос задают много, но ни один из ответов, похоже, не помогает. Также похоже, что перемещение div из повтора заставляет его работать, но опять же, я не уверен, почему.

Спасибо

Ответы

Ответ 1

Удалите vm.

Результат:

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

Почему?, потому что все, что вы установите на $scope, становится доступным на частичном, тогда вам просто нужно его вызвать.

Ответ 2

Отсутствие "vm" перед OpenCourse (course.Id) на самом деле было опечаткой с моей стороны при создании плункера. Я правильно ответил на этот вопрос, так как это заставило плункер работать, но моя проблема была не в этом. Оказалось, что у меня был класс, назначенный внешнему div, который менял индекс z, помещая этот div "позади" других, и не позволяя клику распространяться.

Ответ 3

Если вы используете <label>, при нажатии на него может возникнуть странное поведение. Попробуйте изменить его на что-то еще, если это возможно, и повторите проверку кода.

Ответ 4

Измените его на:

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

Рабочий плунжер