Delete a record in NG-repeat protractor - angularjs

Question

So I'm doing e2e test with protractor and angular,
My first test was adding an element to the list,
Now I'm trying to delete it, and I'm having trouble doing so
So this is what I need to do:
Find the name of the record I want to delete
click on the trashcan icon of that same row and delete it
press ok on the pop up window that appears
Try as much as possible to avoid the use of By.css and prefer everything related to angular( byBinding, model, etc) . This is because this part of the app migh eventually change, hence I will have to redo all this cases.
HTML:
...
<div class="list-group-item ng-scope" ng-repeat="item in teamList">
<span class="glyphicon glyphicon-user"></span>
<span ng-bind="item.name" class="memberName ng-binding">nuevo Team</span>
<a ng-click="editTeam(item._id)" class="hand-cursor">
<span class="glyphicon glyphicon-edit memberRemoveBotton"></span>
</a>
<a ng-confirm-click="Would you like to delete this item?" confirmed-click="deleteTeam(item._id)" class="hand-cursor">
<span class="glyphicon glyphicon-trash memberRemoveBotton"></span>
</a>
</div>
JS:
describe('Testing delete Item',function() {
it('Should delete the Item that just got Inserted',function() {
element(by.css('a[href="#!/item-create"]')).click(); //Opens up the Item dashBoard
element.all(by.repeater('item in itemList')).then(function(table) {
table.element(by.binding('item.name')).each(function(names) {
console.log('the names',names.getText());//I'm trying to find the name of the item that just got inserted
// is there like a nested chaining of elements in here ??
});
});
});
});
Any hints on how to solve this are appreciated

Answer 1

describe('Testing delete Item',function() {
it('Should delete the Item that just got Inserted',function() {
// Assume you know the name of the item you want to delete.
var nameToDelete = 'some name';
// Get the row that has the name by using filter.
element.all(by.repeater('item in itemList')).filter(function(row){
return row.element(by.css('.memberName')).getText().then(function(name){
return name === nameToDelete;
});
})
// Now you should have one row.
.get(0)
// Get the row and click find the remove button.
.element(by.css('.memberRemoveBotton'))
.click();
// Make sure it was deleted.
var names = $$('.list-group-item .memberName').getText();
expect(names).not.toContain(nameToDelete);
});
});
Let me know if it works.

Answer 2

Thank's Andres your answer helped me sort out some doubts I was having.
Anyway here is the answer, one of the most tedious part was the popUp window, let's hope it wont brake later on
it('Should delete the Team that just got Inserted',function() {
element(by.css('a[href="#!/team-create"]')).click(); //Opens up the Team dashBoard
element.all(by.repeater('item in teamList')).filter(function(row) {
return row.element(by.css('.memberName')).getText().then(function(name) {
return name === teamName;
});
}).first().element(by.css('.glyphicon-trash')).click();
testHelper.popUpHandler(ptor);
element.all(by.css('.list-group-item .memberName')).each(function(list) {
expect(list.getText()).not.toContain(teamName);
});
});