仅将 table 数据 <td> 添加到 ng-repeat 的一行

Question

在带有 ng-repeat 的 table 中，是否可以只将一个单元格添加到一行？

在我的代码中：

<tbody>
          <tr ng-repeat="user in users ng-click="selectUser(user)">
            <td>{{user.username}}</td>
            <td><input type="text"....></td>
            <td><input type="checkbox"...></td>
            <td><input type="submit" ...  ng-show="user==selectedUser" /></td>
          </tr>
        </tbody>

这段代码中我希望最后的td只出现在选中的行上，不影响其他行，可以吗？或者是 JS 或 CSS 东西？

Answer 1

有可能，您的代码似乎大部分都是正确的，但您将 selectedUser 用作函数和用户的对象表示。也许您的函数将被称为 selectUser，这将设置 $scope.selectedUser。 ng-show="user == selectedUser" 从那以后就开始了。

我个人不太喜欢在视图中设置条件，所以我在控制器中有一个函数可以比较 returns 真或假。

function isSelectedUser(user) {
    return user == $scope.selectedUser;
}

那你就可以用ng-show="isSelectedUser(user)"

Answer 2

使用 JQuery 将 <td> 附加到 select 行 <tr>。 :nth-child() 是让您连续 select 的简单方法。

var selectedRow = 2;
$('tbody tr:nth-child('+ selectedRow +')').append('<td><input type="submit" /></td>');

Answer 3

首先你应该使用控制器作为语法，它会自动将控制器中的所有内容都放在 1 个对象下，这可能会导致 Angular 出现问题。但我不认为这是这里的问题。

您 select 的用户可能与 selectedUser 相同，但如果他们没有指向相同的引用，他们将不能。如果用户名不同，我会更改 ng-show="user.username == selectedUser.username" 那应该可以正常工作。

仅将 table 数据 <td> 添加到 ng-repeat 的一行

add table data <td> only to one row on ng-repeat

angularjs

angularjs-ng-repeat

angularjs-ng-show