angular2 form + async validation + ChangeDetectionStrategy.OnPush = no view refresh?

Question

[angular2 RC4 + @angular/forms module]

I have a component using OnPush change detection containing a FormGroup. This form contains a FormControl with an async validator.

When the validation is complete (no more pending), the view is not refresh. Only the input blur event makes view refresh..

If I remove the OnPush change detection, it works properly.

This plunker demonstrates it.

Is it an angular bug or I'm doing something wrong?

Answer 1

Looks like you are missing the goal of using ChangeDetectionStrategy.OnPush.

You don't have any @Input property or | async pipe on your component, but it is only point of updating the view state with this strategy - when Input property updated (in ideal with a new object). So just get rid of it for current case

UPDATE

if you still insist on using OnPush in this case, for expected behavior you should trigger change detection manually.

Add import {..., ChangeDetectorRef} from '@angular/core'; and inject instance of it in constructor.

In your method you have to add this:

 uniqueNameAsync(control: FormControl): Promise<{[key: string]:any}>{
   return new Promise(resolve => {
       setTimeout(() =>{
            resolve(null);
            this.changeRef.markForCheck();
      }, 500);
   });
 }