ng-click 在 ng-repeat 中不起作用

ng-click not working in ng-repeat

在 ng -repeat 中 NG-click 没有触发。我想使用 ngclick 只显示特定元素的详细信息。

<body ng-app="mainApp" >
     <div ng-app = "mainApp" class="container" ng-controller="TableFilterController">
    <table ng-app = "mainApp" class ="table table-hover"> 
    <tr><th>Id</th><th>Name</th><th>Age</th><th>Role</th></tr>
        <tr ng-repeat="p in details "><td>{{ $index + 1 }}</td><td><a  ng-click="clickMe()">{{p.name}}</a></td><td>{{p.age}}</td><td>{{p.mass}}</td></tr>
    </table>

        </div>
    </body>

js:

var mainApp= angular.module("mainApp", []);

    mainApp.controller('TableFilterController', function($scope) {
    $scope.clickMe = function(){
       alert("hey");
    }

请尝试去掉table标签中的ng-app,申请ng-app,只能用一次。 也不需要点击事件的标签,因为标签有 href 属性。 使用 button 标签或任何其他标签而不是 tag.

可能有两种不同的情况: 1. 删除重复的 ng-app.

2.Use 这一次,这将测试控制器是否正在调用 onload

   mainApp.controller('TableFilterController', function($scope) {
   alert("its Calling");
 $scope.clickMe = function(){
       alert("hey");
    }
  1. 检查您是否在路由中提到了控制器名称。 4.Check 您的文件代码正在浏览器中加载。

首先检查这些点,否则尝试创建 plunker,以便每个人都可以查看您的代码。

试试下面的代码。您的代码中存在一些问题。

代码中的问题如下

  1. Script you provided was incomplete. There were some missing }, ] and )

  2. Remove ng-app which are not required. It will not create any issues but its not a good practice to include the same ng-app attribute multiple times.

<!DOCTYPE html>
<html>
<head>
<title></title>
<meta charset="utf-8" />
</head>
<body ng-app="mainApp">
<div class="container" ng-controller="TableFilterController">
    <table class="table table-hover">
        <tr><th>Id</th><th>Name</th><th>Age</th><th>Role</th></tr>
        <tr ng-repeat="p in details "><td>{{ $index + 1 }}</td><td><a ng-click="clickMe()">{{p.name}}</a></td><td>{{p.age}}</td><td>{{p.mass}}</td></tr>
    </table>

</div>
<script src="../lib/angular.js"></script>
<script>
    var mainApp= angular.module("mainApp", []);
    mainApp.controller('TableFilterController', function ($scope) {
        $scope.details = [{ "name": "A1", "age": 10, "mass": 20, },
        { "name": "A2", "age": 15, "mass": 30, },
        { "name": "A3", "age": 20, "mass": 40, },
        { "name": "A4", "age": 30, "mass": 60, }]
        $scope.clickMe = function () {
            alert("hey");
        }
    });
</script>