web-dev-qa-db-fra.com

Angular ng-click ne fonctionne pas en div

Ok, je suis coincé ici depuis un moment, et je suis sûr que c'est quelque chose de relativement stupide

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>

Pourquoi ng-click ne tire-t-il pas ici? Il semble que cette question soit souvent posée, mais aucune des réponses ne semble aider. Il semble également que le déplacement du div hors de la répétition le fasse fonctionner, mais encore une fois, je ne sais pas pourquoi.

Merci

18
Carlos Rodriguez

Retirer vm.

Résultat:

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

Pourquoi?, Car tout ce que vous définissez sur $scope devient disponible sur le partiel, il suffit de l'appeler.

20
Felipe Pereira

L'absence de "vm" devant OpenCourse (course.Id) était en fait une faute de frappe de ma part lors de la création du plunker. J'ai marqué une réponse comme correcte, car elle a fait fonctionner le plongeur, mais mon problème n'était pas celui-ci. Il s'est avéré que j'avais une classe assignée à div externe qui changeait le z-index, plaçant cette div "derrière" les autres, et ne permettant pas au clic de se propager.

7
Carlos Rodriguez

Si tu utilises <label> vous pourriez rencontrer un comportement étrange en cliquant dessus. Essayez de le changer en quelque chose d'autre si possible et testez à nouveau votre code.

2
lokers

Changez-le en:

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

Plongeur de travail

0
ltalhouarne