在里面切换，重复我错过了什么

Question

我有一个页面，它使用我的ClientController和模板来显示从服务器检索到的信息表。对于每个数据集合，我想有2个表行，一个总是显示，另一个只显示当第一个被单击。

我已经简化了代码，因为这里有更多的事情要做，但我认为没有什么会影响这一点。

我的HTML看起来像

<table>
  <tbody ng-repeat="session in sessions" ng-switch on="sessionID">
    <tr>
      <td>{{session.test_name}}</td>
      <td><a ng-click="showID(session.session_id)">view {{session.session_id}}</a></td>
    </tr>
    <tr class="pop-open" ng-switch-when="session.sessionID">
      <td colspan="2">
        {{session.session_ID}} and more details
      </td>
    </tr>
  </tbody>
</table>

在controller。js中有

.controller('ClientController', ['$scope', function($scope) {
  $scope.showID = function(sessionID){
    $scope.sessionID = sessionID
    alert($scope.sessionID)
  }
}])

的警告弹出正确的ID，但表行没有显示我所期望的。

Answer 1

对于这个简单的用例场景，您实际上不需要ng-switch，在会话中添加showDetails这样的变量，应该可以…

<table>
  <tbody ng-repeat="session in sessions">
    <tr>
      <td>{{session.test_name}}</td>
      <td><a ng-click="session.showDetails = !session.showDetails">view details</a></td>
    </tr>
    <tr class="pop-open" ng-show="session.showDetails">
      <td colspan="2">
        {{session.session_ID}} and more details
      </td>
    </tr>
  </tbody>
</table>

一次只打开一个

<table>
  <tbody ng-repeat="session in sessions">
    <tr>
      <td>{{session.test_name}}</td>
      <td><a ng-click="showDetailsOfId = session.session_id">view details</a></td>
    </tr>
    <tr class="pop-open" ng-show="showDetailsOfId == session.session_id">
      <td colspan="2">
        {{session.session_ID}} and more details
      </td>
    </tr>
  </tbody>
</table>