我有一个表,当我点击<td>
时,我需要返回这个td名称和行索引。但是,如果我像ng-click="showIndex(field.name, $index)"
那样使它返回td的索引,而不是tr(我知道这是合乎逻辑的:))。我找到了一些方法来检查父索引,但它是jquery,也许有一种方法来检查角度? I have some example
答案 0 :(得分:1)
您应该在
中使用$parent.$index
代替$index
<tr ng-repeat='row in table.row'>
<td ng-click="showIndex(field.name, $parent.$index)" ng-repeat='field in row.fields'>{{field.name}}</td>
</tr>
var app = angular.module('App', []);
app.controller('Ctrl', function($scope) {
$scope.table = {
row: [{
fields: [{
title: "Your name",
name: "John",
id: 'name'
}, {
title: "Your second name",
name: "Doe",
id: 'secondName'
}, {
title: "Your age",
name: 26,
id: 'age'
}, {
title: "Your sex",
name: "Male",
id: 'sex'
}]
}, {
fields: [{
title: "Your name",
name: "Kevin",
id: 'name'
}, {
title: "Your second name",
name: "Parker",
id: 'secondName'
}, {
title: "Your age",
name: 32,
id: 'age'
}, {
title: "Your sex",
name: "Male",
id: 'sex'
}]
}, {
fields: [{
title: "Your name",
name: "Barbara",
id: 'name'
}, {
title: "Your second name",
name: "Streisand",
id: 'secondName'
}, {
title: "Your age",
name: 60,
id: 'age'
}, {
title: "Your sex",
name: "Female",
id: 'sex'
}]
}, {
fields: [{
title: "Your name",
name: "Linda",
id: 'name'
}, {
title: "Your second name",
name: "Lorry",
id: 'secondName'
}, {
title: "Your age",
name: 20,
id: 'age'
}, {
title: "Your sex",
name: "Female",
id: 'sex'
}]
}]
};
$scope.showIndex = function(name, index) {
$scope.showResult = name + ' in the row number ' + index;
}
});
&#13;
<!DOCTYPE html>
<html lang="en" ng-app="App">
<head>
<meta charset="UTF-8">
<title>Document</title>
<link rel="stylesheet" href="style.css">
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.8/angular.min.js"></script>
<script src='script.js'></script>
</head>
<body ng-controller="Ctrl">
<table>
<thead>
<tr>
<th ng-repeat='header in table.row[0].fields'>{{header.title}}</th>
</tr>
</thead>
<tbody>
<tr ng-repeat='row in table.row'>
<td ng-click="showIndex(field.name, $parent.$index)" ng-repeat='field in row.fields'>{{field.name}}</td>
</tr>
</tbody>
</table>
<br>
<b>{{showResult}}</b>
</body>
</html>
&#13;