title: Using [(ngModel)] does not apply change in unit test for inputs inside ngFor
body: <p>I'm having trouble testing an Angular component that utilizes the two way <code>[(ngModel)]</code> binding on checkbox inputs inside an <code>ngFor</code>. It works just fine in the actual app. This is just a problem with the test.</p>
  
  <p>Here's an example test that fails:</p>
  
  <pre><code>import { async, ComponentFixture, fakeAsync, TestBed, tick } from '@angular/core/testing';
  import { Component, EventEmitter, Output } from '@angular/core';
  import { FormsModule } from '@angular/forms';
  
  describe('Example Test', () =&gt; {
    @Component({
      template: `
        &lt;input *ngFor="let value of values"
               type="checkbox"
               class="checkbox-1"
               [(ngModel)]="value.isSelected"
               (change)="output.emit(values)"&gt;
      `,
      styles: [``]
    })
    class TestHostComponent {
      @Output() output: EventEmitter&lt;any&gt; = new EventEmitter();
  
      values = [
        { isSelected: true },
        { isSelected: true },
        { isSelected: true },
      ];
    }
  
    let testHost: TestHostComponent;
    let fixture: ComponentFixture&lt;TestHostComponent&gt;;
  
    beforeEach(async(() =&gt; {
      TestBed.configureTestingModule({
        imports: [FormsModule],
        declarations: [TestHostComponent],
        providers: []
      })
        .compileComponents();
    }));
  
    beforeEach(() =&gt; {
      fixture = TestBed.createComponent(TestHostComponent);
      testHost = fixture.componentInstance;
      fixture.detectChanges();
    });
  
    it('should change isSelected', fakeAsync(() =&gt; {
      const spy = spyOn(testHost.output, 'emit');
      fixture.nativeElement.querySelectorAll('.checkbox-1')[0].click();
      fixture.detectChanges();
      tick();
  
      expect(spy).toHaveBeenCalledWith([
        { isSelected: false }, // it fails because this is still true
        { isSelected: true },
        { isSelected: true },
      ]);
    }));
  });
  </code></pre>
  
  <p>Using <code>[(ngModel)]</code> with a single input that's not in a loop works fine in a similar test. I've even logged the emitted value from <code>(ngModelChange)</code> and when the checkbox is clicked <code>$event</code> is <code>true</code> when it should really be <code>false</code>.</p>
  
  <p>Any ideas?</p>