<script src="angular.min.js"></script>
<script src="ng-restful-collection.min.js"></script>
<div ng-app="TodoList" ng-controller="TodoCtrl" ng-restful-collection="[{type: 'TodoResource'}]">
<ul>
<li ng-repeat="todo in todoResource.data.collection">
<span>{{todo.title}}</span>
<button ng-click="todo.edit != todo.edit">Edit</button>
<button ng-click="todoResource.remove(todo)">Remove</button>
<form ng-if="todo.edit" ng-init="todoCopy = getEditCopy(todo)" name="editForm">
<label>
<span>Todo:</span>
<input type="text" name="todo" ng-model="todo.name" title="Todo" required/>
</label>
<button type="submit" ng-click="todoResource.save(todoCopy, showConfirmation, showError)">Save</button>
</form>
</li>
</ul>
<form name="addForm">
<label>
<span>Todo:</span>
<input type="text" name="todo" ng-model="newTodo.name" required/>
</label>
<button type="submit" ng-click="todoResource.save(newTodo, showConfirmation, showError)">Save</button>
</form>
</div>