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");
}
- 检查您是否在路由中提到了控制器名称。
4.Check 您的文件代码正在浏览器中加载。
首先检查这些点,否则尝试创建 plunker,以便每个人都可以查看您的代码。
试试下面的代码。您的代码中存在一些问题。
代码中的问题如下
Script you provided was incomplete. There were some missing }, ] and )
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>
在 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");
}
- 检查您是否在路由中提到了控制器名称。 4.Check 您的文件代码正在浏览器中加载。
首先检查这些点,否则尝试创建 plunker,以便每个人都可以查看您的代码。
试试下面的代码。您的代码中存在一些问题。
代码中的问题如下
Script you provided was incomplete. There were some missing }, ] and )
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>