0
我想在AngularJS中使用ng-switch來擴展表格列表中的一行，以便在單擊時顯示另一個表格（包含有關該列表項目的更多詳細信息）。如何使用ng-switch切換顯示AngularJS的嵌套表格？
但是，我無法顯示嵌套表。我注意到這個問題只發生在嵌套表格中。如果我使用ng-switch來擴展td而不是表，它會按預期工作。
這裏有一個的jsfiddle和我的代碼來說明問題：fiddle
的HTML：
<body ng-app="listAndDetails">
<div>
<table class="table table-bordered" ng-controller="ListAndOneDetailCtrl">
<thead>
<tr>
<th>Name</th>
<th>e-mail</th>
</tr>
</thead>
<tbody ng-repeat="user in users" ng-click="toggleSelected()" ng-switch on="isSelected(user)">
<tr>
<td>{{user.name}}</td>
<td>{{user.email}}</td>
</tr>
<tr ng-switch-when="true" class="light-gray">
<table>
<tr>
<td>Country</td>
<td>Address</td>
<td>Description</td>
</tr>
<tr>
<td>{{user.country}}</td>
<td>{{user.address}}</td>
<td>{{user.desc}}</td>
</tr>
</table>
</tr>
</tbody>
</table>
</div>
<div ng-controller="ListAndManyDetailsCtrl">
<table class="table table-bordered">
<thead>
<tr>
<th>Name</th>
<th>e-mail</th>
</tr>
</thead>
<tbody ng-repeat="user in users" ng-controller="UserCtrl" ng-click="toggleSelected()" ng-switch on="isSelected()">
<tr>
<td>{{user.name}}</td>
<td>{{user.email}}</td>
</tr>
<tr ng-switch-when="true" class="light-gray">
<td>{{user.country}}</td>
<td>{{user.address}}</td>
<td>{{user.desc}}</td>
</tr>
</tbody>
</table>
</div>
</body>
的JavaScript：
angular.module('listAndDetails', [])
.value('users', [
{ name:'Damien', email:'[email protected]', desc:'Damien details go here...', country:'US', address:'address1'},
{ name:'Alex', email:'[email protected]', desc:'Alex details go here...', country:'UK', address:'address2'}
])
.controller('ListAndOneDetailCtrl', function ($scope, users) {
$scope.users = users;
$scope.selectUser = function (user) {
$scope.selectedUser = user;
};
$scope.isSelected = function (user) {
return $scope.selectedUser === user;
};
})
.controller('ListAndManyDetailsCtrl', function ($scope, users) {
$scope.users = users;
})
.controller('UserCtrl', function ($scope) {
$scope.toggleSelected = function() {
$scope.selected = !$scope.selected;
};
$scope.isSelected = function (user) {
return $scope.selected;
};
});
之上嘗試的div來顯示一個嵌套表點擊列表項，但沒有任何反應。
底部的div試圖顯示孩子td項目單擊列表項時，它的工作原理完全按預期。
有沒有人有任何想法當我試圖展開使用ng-switch顯示嵌套表的問題是什麼？以及如何解決它？