Skip to content

signal-forms: FormValueControl is unable to mark field as dirty #63623

@ThiloAschebrock

Description

@ThiloAschebrock

Which @angular/* package(s) are the source of the bug?

forms

Is this a regression?

No

Description

I have been playing around with the new FormValueControl interface to implement custom controls in signal forms.

I noticed that FormValueControl does not automatically mark the field as dirty if the value changes and lacks the ability to manually mark as dirty because dirty is only exposed as an input signal to FormValueControl.

@Component({
  selector: 'app-input',
  changeDetection: ChangeDetectionStrategy.OnPush,
  template: `
    <input 
      [value]="value()"
      (input)="setValue($event)"
      (blur)="markTouched()"
    />
  `,
})
export class Input implements FormValueControl<string> {
  readonly value = model<string>('');
  readonly touched = model<boolean>(false);
  readonly dirty = input<boolean>(false);

  setValue(event: Event) {
    this.value.set((event.target as HTMLInputElement).value);
  }

  markTouched() {
    this.touched.set(true);
  }
}

Please provide a link to a minimal reproduction of the bug

https://stackblitz.com/edit/stackblitz-starters-tyvqgwbf?file=src%2Fmain.ts

Please provide the exception or error you saw

When implementing a custom input via `FormValueControl` the field will not automatically be marked as dirty and cannot be marked as dirty via the provided interface.

Please provide the environment you discovered this bug in (run ng version)

Angular CLI: 21.0.0-next.2
Node: 20.19.1
Package Manager: npm 10.8.2
OS: linux x64
    

Angular: 21.0.0-next.2
... build, cli, common, compiler, compiler-cli, core, forms
... platform-browser, router

Package                      Version
------------------------------------
@angular-devkit/architect    0.2100.0-next.2
@angular-devkit/core         21.0.0-next.2
@angular-devkit/schematics   21.0.0-next.2
@schematics/angular          21.0.0-next.2
rxjs                         7.8.2
typescript                   5.9.2

Anything else?

The signal form prototype already looks amazing!

Metadata

Metadata

Assignees

No one assigned

    Type

    No type

    Projects

    No projects

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions