mdAutoComplete does not update NgModel in time on (click) with (focusout)

[LilSebastian5000]

Bug, feature request, or proposal:

Sometimes, when filtering on a match by using a function in the (click) event, while also using a (focusout) event, the [(ngModel)] value is not updated in time, and the filter finds no match. This does not happen with key events or focusout events.

What is the expected behavior?

(click) should behave the same way as (focusout), (keyup.esc), (keyup.enter), etc.

What are the steps to reproduce?

https://plnkr.co/edit/ssnnkT7lwUshuT9qP4y2?p=preview

1. Type the letter 't'
2. Select any option by CLICKING it (ex: "yyyy-MM-dd'T'HH:mm:ss.SSSXXX")
3. The form resets because ngModel is set to "t" and NOT "yyyy-MM-dd'T'HH:mm:ss.SSSXXX", thus finding no match in the array list

This seems to occur with longer strings.

Which versions of Angular, Material, OS, TypeScript, browsers are affected?

Angular 4.0.2, Material 2.0.0-beta.5, Typescript 2.2.2, Chrome

[julianobrasil]

Seems like focusout event propagates faster than the ngModel update. Try this:

changeDate(){
      setTimeout(() => {
        var self = this;

        var match:string[] = self.dates.filter(function(item){
            return item === self.name;
        });

        if(match.length < 1){

            self.name = '';
            self.dateCtrl.reset();
        }
          
      },100);
  }

[LilSebastian5000]

@julianobrasil Awesome, that did it! Thanks!

I'm not a huge fan of using timeouts, but hopefully this will be an easy fix for the material team.