Skip to content

feat(forms): add default updateOn values to groups and arrays #18536

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
merged 1 commit into from
Aug 9, 2017

Conversation

kara
Copy link
Contributor

@kara kara commented Aug 4, 2017

This PR adds support for setting default updateOn values in FormGroups and FormArrays. If you set updateOn to 'blur' at the group level, all child controls will default to 'blur', unless the child has explicitly specified a different updateOn value.

const c = new FormGroup({
   one: new FormControl()
}, {updateOn: 'blur'});

It's worth noting that parent groups will always update their value and validity immediately upon value/validity updates from children. In other words, if a group is set to update on blur and its children are individually set to update on change, the group will still update on change with its children; its default value will simply not be used.

Upcoming PRs will address:

  • Support in template-driven forms
  • Option for skipping initial validation run or more global error display configuration
  • Better support of reactive validation strategies

See more context in #18408, #18514, and the design doc.

@kara kara changed the title Update form group feat(forms): add default updateOn values to groups and arrays Aug 4, 2017
@kara kara force-pushed the update-form-group branch 2 times, most recently from 2194b86 to b5323b2 Compare August 4, 2017 21:23
@kara kara added action: review The PR is still awaiting reviews from at least one requested reviewer state: blocked labels Aug 4, 2017
@mary-poppins
Copy link

You can preview 0ba8999 at https://pr18536-0ba8999.ngbuilds.io/.

@mary-poppins
Copy link

You can preview 2194b86 at https://pr18536-2194b86.ngbuilds.io/.

@mary-poppins
Copy link

You can preview b5323b2 at https://pr18536-b5323b2.ngbuilds.io/.

Copy link
Contributor

@tinayuangao tinayuangao left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

LGTM

dispatchEvent(input, 'input');
fixture.detectChanges();

expect(control.value).toEqual('', 'Expected value to remain unchanged until submit.');
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

nit: Also check the value is unchanged when blurred?

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Oh, good point. 👌

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Should be updated now!

@kara kara force-pushed the update-form-group branch from 0372c65 to 7231271 Compare August 8, 2017 00:32
@mary-poppins
Copy link

You can preview 7231271 at https://pr18536-7231271.ngbuilds.io/.

Copy link
Contributor

@IgorMinar IgorMinar left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

please add short property-level api doc snippet

@@ -242,6 +245,10 @@ export abstract class AbstractControl {
*/
get statusChanges(): Observable<any> { return this._statusChanges; }

get updateOn(): FormHooks {
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Please add api docs

@IgorMinar IgorMinar added action: cleanup The PR is in need of cleanup, either due to needing a rebase or in response to comments from reviews and removed action: review The PR is still awaiting reviews from at least one requested reviewer labels Aug 8, 2017
@kara kara force-pushed the update-form-group branch from 7231271 to e4695c2 Compare August 8, 2017 18:38
@kara kara removed the action: cleanup The PR is in need of cleanup, either due to needing a rebase or in response to comments from reviews label Aug 8, 2017
@kara kara added the target: major This PR is targeted for the next major release label Aug 8, 2017
This commit adds support for setting default `updateOn` values
in `FormGroups` and `FormArrays`. If you set `updateOn` to
’blur’` at the group level, all child controls will default to `’blur’`,
unless the child has explicitly specified a different `updateOn` value.

```
const c = new FormGroup({
   one: new FormControl()
}, {updateOn: blur});
```

 It's worth noting that parent groups will always update their value and
validity immediately upon value/validity updates from children. In other
words, if a group is set to update on blur and its children are individually
set to update on change, the group will still update on change with its
children; its default value will simply not be used.
@kara kara force-pushed the update-form-group branch from e4695c2 to c838fe3 Compare August 8, 2017 18:48
@mary-poppins
Copy link

You can preview e4695c2 at https://pr18536-e4695c2.ngbuilds.io/.

@mary-poppins
Copy link

You can preview c838fe3 at https://pr18536-c838fe3.ngbuilds.io/.

@kara kara added the action: merge The PR is ready for merge by the caretaker label Aug 8, 2017
@vicb vicb merged commit ff5c58b into angular:master Aug 9, 2017
asnowwolf pushed a commit to asnowwolf/angular that referenced this pull request Aug 11, 2017
…ar#18536)

This commit adds support for setting default `updateOn` values
in `FormGroups` and `FormArrays`. If you set `updateOn` to
’blur’` at the group level, all child controls will default to `’blur’`,
unless the child has explicitly specified a different `updateOn` value.

```
const c = new FormGroup({
   one: new FormControl()
}, {updateOn: blur});
```

 It's worth noting that parent groups will always update their value and
validity immediately upon value/validity updates from children. In other
words, if a group is set to update on blur and its children are individually
set to update on change, the group will still update on change with its
children; its default value will simply not be used.
juleskremer pushed a commit to juleskremer/angular that referenced this pull request Aug 26, 2017
…ar#18536)

This commit adds support for setting default `updateOn` values
in `FormGroups` and `FormArrays`. If you set `updateOn` to
’blur’` at the group level, all child controls will default to `’blur’`,
unless the child has explicitly specified a different `updateOn` value.

```
const c = new FormGroup({
   one: new FormControl()
}, {updateOn: blur});
```

 It's worth noting that parent groups will always update their value and
validity immediately upon value/validity updates from children. In other
words, if a group is set to update on blur and its children are individually
set to update on change, the group will still update on change with its
children; its default value will simply not be used.
juleskremer pushed a commit to juleskremer/angular that referenced this pull request Aug 28, 2017
…ar#18536)

This commit adds support for setting default `updateOn` values
in `FormGroups` and `FormArrays`. If you set `updateOn` to
’blur’` at the group level, all child controls will default to `’blur’`,
unless the child has explicitly specified a different `updateOn` value.

```
const c = new FormGroup({
   one: new FormControl()
}, {updateOn: blur});
```

 It's worth noting that parent groups will always update their value and
validity immediately upon value/validity updates from children. In other
words, if a group is set to update on blur and its children are individually
set to update on change, the group will still update on change with its
children; its default value will simply not be used.
@kara kara deleted the update-form-group branch October 13, 2018 01:08
@angular-automatic-lock-bot
Copy link

This issue has been automatically locked due to inactivity.
Please file a new issue if you are encountering a similar or related problem.

Read more about our automatic conversation locking policy.

This action has been performed automatically by a bot.

@angular-automatic-lock-bot angular-automatic-lock-bot bot locked and limited conversation to collaborators Sep 14, 2019
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Labels
action: merge The PR is ready for merge by the caretaker area: forms cla: yes target: major This PR is targeted for the next major release
Projects
None yet
Development

Successfully merging this pull request may close these issues.

6 participants