0

Within a ng-repeat I have a ng-switch conditional. I want the value of the ng-switch argument to be a binding. However the curly-bracket binding doesn't seem to be converted into the expected generated value. I'm aware that ng-switch creates a new scope, and that is surely causing the problem. I know about a 'dot' work-around but as the values here are coming from a service via a controller query, I can't figure out how to implement it in this situation.

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();

-edit-

this is the function that triggers the switch

$scope.editUser = function(usernameEdit) {
    $scope.editState = usernameEdit;
};
Community
  • 1
  • 1
Fisu
  • 3,294
  • 9
  • 39
  • 61
  • Can you explain what you are trying to do here: `ng-switch-when="{{user.username}}"`? Can you instead use ng-switch-default? – Mark Rajcok Apr 08 '13 at 21:34
  • This table row is to be repeated for each user. When I press the 'edit' link next to each user i want the switch conditional to match just that username and so hide the paragraph and show the text input. If I used switch default wouldn't all the users in the list switch? – Fisu Apr 09 '13 at 04:46
  • I've also added the function that triggers the switch argument – Fisu Apr 09 '13 at 05:54

1 Answers1

2

A single $scope.editState won't work if you want to be able to edit multiple users at the same time. I suggest putting an edit property on each user, and use that property to control the 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

Mark Rajcok
  • 362,217
  • 114
  • 495
  • 492
  • Brilliant thanks for making it so clear, it seems I didn't really understand ng-switch from the angular docs – Fisu Apr 10 '13 at 05:50