$setViewValue makes invalid field blank if using attribute «pattern»

[artuska]

Plunker — http://plnkr.co/edit/54otaclvjjZUW63vR9QT?p=preview

There I have two input fields and two directives — the only difference in this fields and directives is that one has «pattern="a-z"» attribute and other has «blabla="a-z"» attribute.

The one with «pattern» attribute doesn't work — $setViewValue() makes it blank if it does not fit the pattern regexp.

So, what is the problem with this «pattern» attribute — why does it brake everything? Does Angular use both «pattern» and «ng-pattern» attribute to validate input field? Why «pattern» attribute makes field blank if it is not valid?

Also, I have changed «pattern» to «ng-pattern» and it resolved the problem:

<input type="text" name="foo" ng-pattern="a-z" ng-model="user.foo" working-input>

and in directive:

var pattern = attributes.ngPattern;

I'm creating this issue for those who has the same problem and spend about 30 minutes to resolve it (because renaming «pattern» attribute to something else really is not obvious).

(I have found some issues here but they all are about $asyncValidators)

[artuska]

Well, using ng-pattern is a bad idea — it accepts only valid regexps. Now I use a directive name as attribute:

<input type="text" name="foo" ng-model="user.foo" working-input="a-z">

and in directive:

var pattern = attributes.workingInput;

[Narretz]

pattern is recognized by angular as a directive and processed as such. There's currently a difference between the attributes: pattern takes the regex as a simple string, ng-pattern takes it as a regex ' object'. So in both cases, you will run into problems if you use the attribute for you own uses. Can't you use a different attribute name?

e: I see, you already changed the attribute name.

[Narretz]

tbh honest I am not really sure why $setViewValue would empty the whole input. Can you provide a minimal example if this happening?

[artuska]

Plunker — http://plnkr.co/edit/54otaclvjjZUW63vR9QT?p=preview — just try to enter some letters a-z and then some digits in first input (with directive «broken-input»).

[Narretz]

Thanks for the plnkr. This is a dupe of #9156

[Narretz]

The problem is that the $render function for ngModelController now explicitly forbids rendering when the modelValue is empty, which doesn't make sense. Until this is fixed, you can overwrite the $render function with something like what this PR implements: #9681

[artuska]

Thank you! And thanks for explaining all this $render stuff :)