On click opens a new tab I need to interact with, however I just stay on the same window - angularjs

Question

I am new to protractor and AngularJS just starting to get the hang of it. I have a login page that on click opens a new browser tab. The new browser tab is where I want to continue my test however I do not know how to do switch to the new browser tab.
I've tried the below code that was suggested here however it didn't do anything just stayed on the page.
element(by.css('span.icon.icon-add')).click();.then(function() {
browser.getAllWindowHandles().then(function(handles) {
newWindowHandle = handles[1]; // this is your new window
browser.switchTo().window(newWindowHandle).then(function() {
element.all(by.css("input[type$='text']")).first().clear().sendKeys('anemailaddy#newmarketinc.com');
});
});
});
Any help would be fantastic! Thank you

Answer 1

changed code to look like this:
this.clicksAddUser = function() {
element(by.css('span.booking-icon.icon-gear')).click();
element.all(by.css('li:nth-of-type(4) > a')).click().then(function() {
browser.getAllWindowHandles().then(function(handles) {
newWindowHandle = handles[1]; // this is your new window
browser.switchTo().window(newWindowHandle).then(function() {
element(by.css('span.icon.icon-add')).click()
element.all(by.css("input[type$='text']")).first().clear().sendKeys('anemailaddy#newmarketinc.com');
});
});
});
Because I was clicking a drop down menu in a separate this statement the drop down menu was closing before there was a chance to click on the login button. combined the code fixed the problem.