angularjs - not - ng-< onclick
Angular ng-click no funciona en div (4)
Cambiarlo a:
ng-click="OpenCourse(course.Id)"
Ok, he estado atrapado aquí por un tiempo, y estoy seguro de que es algo relativamente tonto
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>
¿Por qué ng-click está disparando aquí? Parece que esta pregunta se hace mucho, pero ninguna de las respuestas parece ayudar. También parece que mover el div fuera de la repetición lo hace funcionar, pero una vez más, no estoy seguro de por qué.
Gracias
Eliminar vm.
Resultado:
<div ng-repeat="course in vm.Courses" ng-click="OpenCourse(course.Id)">
¿Por qué ?, porque todo lo que establece en $scope está disponible en forma parcial, entonces solo tiene que llamarlo.
La falta de "vm" frente a OpenCourse (course.Id) fue en realidad un error tipográfico de mi parte al crear el plunker. He marcado una respuesta como correcta, ya que causó que el plunker funcionara, pero mi problema no era este. Resultó que tenía una clase asignada a div externa que estaba cambiando el índice z, poniendo esa div "detrás" de las otras, y no permitiendo que el clic se propague.
Si usa <label> , puede experimentar un comportamiento extraño al hacer clic en él. Intente cambiarlo a otra cosa si es posible y vuelva a probar su código.