Skip to content
This repository has been archived by the owner on Apr 12, 2024. It is now read-only.

ngAttr added attributes don't trigger directives #12363

Closed
twhitbeck opened this issue Jul 16, 2015 · 5 comments
Closed

ngAttr added attributes don't trigger directives #12363

twhitbeck opened this issue Jul 16, 2015 · 5 comments
Assignees
Milestone

Comments

@twhitbeck
Copy link
Contributor

This may be by design, but I thought I'd bring it up.

Since ngAttr-prefixed attributes are interpolated with allOrNothing, an attribute may or may not be present initially. If the expression is defined on the first evaluation, it looks like the resulting attribute will trigger directives. However, if the expression is initially undefined, when it later becomes defined the attribute that is added will not cause any directives to be applied to the element.

My use case is this: I'm using ng-attr-min and ng-attr-max on an input[type=date] with something like ng-attr-min="{{minDate | date:'yyyy-MM-dd'}}". If minDate is undefined, I don't want there to be any min validation. When minDate becomes defined, the min attribute is properly set but the min directive is not applied retroactively, therefore I don't get my angular min validation.

The alternatives are

  • Use ngMin, but this doesn't set the min attribute and on Chrome the datepicker won't be properly restricted.
  • Use interpolation on min directly (e.g. min="{{minDate | date:'yyyy-MM-dd'}}"), but when minDate is undefined, this leaves a dangling min attribute with no value which incorrectly makes any value invalid (this might be a bug).
@caitp
Copy link
Contributor

caitp commented Jul 16, 2015

This is one of those difficult things --- unfortunately, we don't have a good way to trigger compilation when the DOM changes in this way. Attempting to do so would massively harm performance.

To add to this, there's also no way to "trigger" one particular directive, all you can do is compile an entire chunk of DOM. You could explicitly recompile the chunk of DOM you want to, but there isn't really a good way to do this.

@caitp caitp closed this as completed Jul 16, 2015
@caitp caitp reopened this Jul 16, 2015
@caitp
Copy link
Contributor

caitp commented Jul 16, 2015

oops, didn't mean to close that, maybe someone else will have something to say about it.

@pkozlowski-opensource
Copy link
Member

Agree with @caitp that it would be very hard to support. I would suggest that we focus on the original issue of the conditional min validation here instead.

@gkalpak
Copy link
Member

gkalpak commented Jul 16, 2015

This is easy to work around by means of: min="{{(minDate || 0) | date:'yyyy-MM-dd'}}"
(It's not ideal though...)

@twhitbeck
Copy link
Contributor Author

All makes sense.
It seems to me like the issue could be solved if the min directive could handle having a blank value by not validating.

<input type="date" min ng-model="date"> will invalidate any input.

@Narretz Narretz added this to the Ice Box milestone Aug 15, 2015
@Narretz Narretz self-assigned this Aug 15, 2015
gkalpak added a commit to gkalpak/angular.js that referenced this issue Sep 8, 2015
When the min/max attributes are empty (i.e. `attrs.min/max === ''`), there
should be no min/max validation applied (i.e. all values should be valid
wrt min/max). This works correctly for `input[number]`, but not for date
input family (`input[date/datetime-local/time/week/month]`).

In the case on `input[number]`, an empty string for `attrs.min/max` is
translated to `undefined` for `minVal/maxVal` and a check for
`isUndefined(minVal/maxVal)` ensures that no min/max validation takes
place.
For the data input family, an empty string for `attrs.min/max` is
translated to `NaN` (by `parseDate()`), so an additional check (for
`isNaN(minVal/maxVal)`) is required.

Fixes angular#12363
gkalpak added a commit to gkalpak/angular.js that referenced this issue Sep 8, 2015
When the min/max attributes are empty (i.e. `attrs.min/max === ''`), there
should be no min/max validation applied (i.e. all values should be valid
wrt min/max). This works correctly for `input[number]`, but not for date
input family (`input[date/datetime-local/time/week/month]`).

In the case on `input[number]`, an empty string for `attrs.min/max` is
translated to `undefined` for `minVal/maxVal` and a check for
`isUndefined(minVal/maxVal)` ensures that no min/max validation takes
place.
For the data input family, an empty string for `attrs.min/max` is
translated to `NaN` (by `parseDate()`), so an additional check (for
`isNaN(minVal/maxVal)`) is required.

Fixes angular#12363
@gkalpak gkalpak closed this as completed in 544001f Sep 9, 2015
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Projects
None yet
Development

No branches or pull requests

5 participants