fix(forms): report forbidden 2way bindings on when FormField is applied

We were already reporting regular bindings but not 2way.

fixes #70219
This commit is contained in:
Matthieu Riegler
2026-08-16 12:26:25 +02:00
committed by Jessica Janiuk
parent da9f3e2118
commit c819880b91
3 changed files with 29 additions and 0 deletions
@@ -625,6 +625,8 @@ export class OutOfBandDiagnosticRecorderImpl implements OutOfBandDiagnosticRecor
name = `[${node.name}]`;
} else if (node.type === BindingType.Attribute) {
name = `[attr.${node.name}]`;
} else if (node.type === BindingType.TwoWay) {
name = `[(${node.name})]`;
} else {
// We shouldn't hit this, but we have this logic as a fallback.
name = node.name;
@@ -480,6 +480,31 @@ runInEachFileSystem(() => {
);
});
it('should report unsupported two-way bindings on a field', () => {
env.write(
'test.ts',
`
import {Component, signal} from '@angular/core';
import {FormField, form} from '@angular/forms/signals';
@Component({
template: '<input type="number" [formField]="f" [(max)]="maxLength"/>',
imports: [FormField]
})
export class Comp {
f = form(signal(''));
maxLength = 10;
}
`,
);
const diags = env.driveDiagnostics();
expect(diags.length).toBe(1);
expect(extractMessage(diags[0])).toBe(
`Binding to '[(max)]' is not allowed on nodes using the '[formField]' directive`,
);
});
it('should report unsupported property bindings on a field with a custom control', () => {
env.write(
'test.ts',
@@ -429,6 +429,8 @@ export function checkUnsupportedFieldBindings(
unsupportedBindingFields.has(input.name.toLowerCase())
) {
tcb.oobRecorder.formFieldUnsupportedBinding(tcb.id, input);
} else if (input.type === BindingType.TwoWay && unsupportedBindingFields.has(input.name)) {
tcb.oobRecorder.formFieldUnsupportedBinding(tcb.id, input);
}
}