material icon indicating copy to clipboard operation
material copied to clipboard

feat(contact-chips): add support for ng-blur and ng-focus

Open vaclavpavlicek opened this issue 7 years ago • 2 comments

Bug, feature request, or proposal:

Feature

What is the expected behavior?

ngBlur working with mdContactChips.

What is the current behavior?

ngBlur isn't working with mdContactChips.

CodePen and steps to reproduce the issue:

<md-contact-chips
        ng-model="ctrl.contacts" 
        md-contacts="ctrl.querySearch($query)"
        md-contact-name="name"
        md-contact-image="image"
        md-contact-email="email"
        md-require-match="true"
        md-highlight-flags="i"
        filter-selected="ctrl.filterSelected"
        placeholder="To"
        ng-blur="ctrl.onBlur()">
    </md-contact-chips>

Method ctrl.onBlur isn't called because ngBlur isn't supported.

What is the use-case or motivation for changing an existing behavior?

I want to validate mdContactChips, but I want to display error message after user leaves mdContactChips. I don't want to display error message all the time when mdContactChips is empty.

Which versions of AngularJS, Material, OS, and browsers are affected?

AngularJS 1.6.9 AngularJS Material 1.1.8

Is there anything else we should know? Stack Traces, Screenshots, etc.

No

vaclavpavlicek avatar Feb 27 '18 07:02 vaclavpavlicek

There is ongoing work to support md-add-on-blur for mdContactChips: https://github.com/angular/material/pull/10009. But it looks like that won't solve your use case here since you want to call a handler function, not actually add the chip?

It looks like this feature (https://github.com/angular/material/issues/6301) was requested in the past, but closed as part of the deprecation effort as "won't fix".

Please provide a CodePen demo that shows ng-blur not working with mdContactChips.

Then we would be happy to accept a pull request that adds support for ng-blur (and ng-focus) to mdContactChips.

Splaktar avatar Feb 27 '18 19:02 Splaktar

@Splaktar here is CodePen demo: https://codepen.io/vendasky/pen/XEyLOw. If you click to text input, you'll see input focus message. If text input loses input, you'll see blur message. This doesn't work for md-contact-chips.

vaclavpavlicek avatar Apr 08 '18 12:04 vaclavpavlicek