Removing items from LocalStorage with AngularJS - angularjs

Question

I'm trying to adapt one of the many to-do list examples built with AngularJS and LocalStorage to a little app of mine.
So far I'm able to create and save items into the LocalStorage, and to delete items both from the view and the LocalStorage. The problem I'm finding now is that when I delete items, the delete function won't delete the item I chose, but the first from the list.
For instance, if I have an array of 1-2-3-4 and I choose to delete the 3, it will always delete the 1, and then the 2, and so on.
Here's my code, being a beginner as I am, I'm sure I missed something...
angular.module('Logger', [])
.controller('TodoCtrl',['$scope', function($scope){
$scope.todos = extractJSONFromLocalStorage();
$scope.addTodo = function () {
$scope.todos.push({ text: $scope.formTodoText});
jsonToLocalStorage($scope.todos);
$scope.formTodoText = '';
};
$scope.kill = function (index) {
$scope.todos.splice(index, 1);
localStorage.removeItem(index);
jsonToLocalStorage($scope.todos);
};
function extractJSONFromLocalStorage() {
return JSON.parse(localStorage.getItem("todo")) || [
{text: 'learn angular', done: false},
{text: 'eat food', done: false},
{text: 'Click to remove', done: true}
];
}
function jsonToLocalStorage(todos) {
var jsonTodo = angular.toJson(todos);
if (jsonTodo != 'null') {
localStorage.setItem("todo", jsonTodo);
} else {
alert("Invalid JSON!");
}
}
}]);
And the HTML:
<h1><span class="modal-title">Edit drivers</span></h1>
<li ng-repeat="todo in todos">
<span class="done-true">{{todo.text}}</span>
<label class="delete pull-right" for='{{todo.text}}' ng-click="kill(index)">
<div><i class="fa fa-close"></i></div>
</label>
</li>
<h2>Add new driver<h2>
<form action="" class="form-horizontal controller" ng-submit="addTodo()">
<input class="form-control" type="text" placeholder="Enter driver name" ng-model="formTodoText" ng-model-instant>
<button class="btn btn-success form-control">Add</button>
</form>
Any tips would be highly appreciated!

Answer 1

try putting $index instead of index:
<label class="delete pull-right" for='{{todo.text}}' ng-click="kill($index)">