Can Protractor locate and inspect elements of list created by bootstrapped angularjs's ng-for?

Question

When run in Protractor the following code

    describe('todomvc angular2 tests', function() {
      it('add to-dos and verify that they are displayed', function() {

        browser.ignoreSynchronization = true; // The site/app under test uses AngularJS in what might be called a manually bootstrapped fashion, i.e. without use the ng-app directive.
        browser.get('http://todomvc.com/examples/angular2/');

        browser.driver.sleep(1000); // There's got to be a better way to wait for the custom  tag (which is a custom AngularJS directive) to load.

        var el = element(by.css('input.new-todo'));
        el.clear();
        el.sendKeys('task 1\r\n');
        el.sendKeys('task 2\r\n');

        browser.driver.sleep(2000); // aid in debugging

        var resultlist = element.all(by.repeater('todo in todoStore.todos')); // This doesn't work...
        expect(resultlist.count()).toEqual(2);

      });
    });

generates the following output:

    Using the selenium server at http://localhost:4444/wd/hub
    [launcher] Running 1 instances of WebDriver
    F

    Failures:

      1) todomvc angular2 tests add to-dos and verify that they are displayed
       Message:
         Expected 0 to equal 2.
       Stacktrace:
         Error: Failed expectation

What is the best way (or any working way) to find and inspect the items within todoStore.todos (i.e. ul.todo-list)?

Answer 1

Protractor should be able to see those elements just fine. I wonder if the elements are not resolving for the expect? See if maybe this promise works:

$$('[ng-repeat="todo in todoStore.todos"]').count().then(function(countOfElements){
    expect(countOfElements).toEqual(2, 'Error: Todo count did not match');
})