AngularJS - 如何在 ng-switch 中访问绑定值答案

【问题标题】：AngularJS - How to access a binding value within ng-switchAngularJS - 如何在 ng-switch 中访问绑定值
【发布时间】：2013-04-08 19:04:33
【问题描述】：

在 ng-repeat 中，我有一个 ng-switch 条件。我希望 ng-switch 参数的值是一个绑定。但是，大括号绑定似乎没有转换为预期的生成值。我知道 ng-switch 创建了一个新范围，这肯定会导致问题。我知道'dot' work-around，但由于这里的值通过控制器查询来自服务，我不知道如何在这种情况下实现它。

html

<tr ng-repeat="user in users">
    <td ng-switch on="editState"><p ng-switch-when="noEdit">{{user.username}}</p><input type="text" value="{{user.username}}" ng-switch-when="{{user.username}}"></td>
</tr>

controller.js

$scope.users = Users.query();

-编辑-

这是触发开关的函数

$scope.editUser = function(usernameEdit) {
    $scope.editState = usernameEdit;
};

【问题讨论】：

你能解释一下你想在这里做什么：ng-switch-when="{{user.username}}"？你可以改用 ng-switch-default 吗？
此表格行将针对每个用户重复。当我按下每个用户旁边的“编辑”链接时，我希望切换条件以匹配该用户名，因此隐藏段落并显示文本输入。如果我使用切换默认值，列表中的所有用户不会切换吗？
我还添加了触发switch参数的函数

标签： angularjs

【解决方案1】：

如果您希望能够同时编辑多个用户，则单个 $scope.editState 将不起作用。我建议在每个user 上放置一个edit 属性，并使用该属性来控制ng-switch：

<tr ng-repeat="user in users">
   <td ng-switch on="user.edit"> 
      <span ng-switch-when="true">
         <input  type="text" value="{{user.username}}">
         <a href="" ng-click="user.edit=false">done</a>
      </span>
      <p ng-switch-default>
         <a href="" ng-click="user.edit=true">edit</a> {{user.username}}
      </p>
   </td>
</tr>

Fiddle

【讨论】：

非常感谢您说得这么清楚，看来我并没有真正理解角度文档中的 ng-switch