Skip to content

FormControl shortly valid between valueChanges and validation #13920

@david-bulte

Description

@david-bulte

I'm submitting a ... (check one with "x")

[x ] bug report => search github for a similar issue or PR before submitting
[ ] feature request
[ ] support request => Please do not submit support request here, instead see https://github.com/angular/angular/blob/master/CONTRIBUTING.md#question

Current behavior

I have a reactive form. One of the fields has a minimum length of 6. I'm not using the minLength directive for validation, as I only want to warn the user he hasn't typed enough characters when he leaves the field or stops typing for a couple of milliseconds (actually 400). Therefore validation is handled through subscribing to the field's valueChanges Observable:

     const ctrl = this.form.get('password');`
     ctrl
        .valueChanges
        .debounceTime(400)
        .distinctUntilChanged()
        .subscribe(val => {
          if (val && val.length < 6) {
            ctrl.setErrors({minlength: true});
          }
        });

This works, however I noticed that, on each "valueChange", the field is set to valid again. If I play with the debounceTime and set it to a 1 second, you clearly see the ngValid styling kick in after each keystroke. If you then wait typing for 1 second, the field is invalidated again.

Expected behavior

The field should remain invalid after each valueChange.

  • Angular version: 2.4.0

Metadata

Metadata

Assignees

No one assigned

    Type

    No type

    Projects

    No projects

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions