Edit In Place Content Editing

You should put the form inside each node and use ng-show and ng-hide to enable and disable editing, respectively. Something like this:

<li>
  <span ng-hide="editing" ng-click="editing = true">{{bday.name}} | {{bday.date}}</span>
  <form ng-show="editing" ng-submit="editing = false">
    <label>Name:</label>
    <input type="text" ng-model="bday.name" placeholder="Name" ng-required/>
    <label>Date:</label>
    <input type="date" ng-model="bday.date" placeholder="Date" ng-required/>
    <br/>
    <button class="btn" type="submit">Save</button>
   </form>
 </li>

The key points here are:

• I’ve changed controls ng-model to the local scope
• Added ng-show to form so we can show it while editing
• Added a span with a ng-hide to hide the content while editing
• Added a ng-click, that could be in any other element, that toggles editing to true
• Changed ng-submit to toggle editing to false

Here is your updated Plunker.