1

Here is the object I am working with:

Value {
  name: string,
  mode: number,
}

I have a text input:

<input type="text" formControlName="valueField">

When enters text into the input, it needs to set the mode also.

If the user enters "OOS" into the text field, the mode should be set to 1.

If the user enters "NMS" into the text field, the mode should be set to 2.

If the user enters anything else - including nothing, the mode should be set to 0.

Also, if this formControlName has a value on page load, the value displays as [object, Object] as it is bound to the entire object.

When the object only has the name property populated, it displays fine.

What I want to achieve is the ability for the user to enter in the string value, and have this set the object, but it also must work with a two-way binding.

Learning Developer
  • 156
  • 2
  • 4
  • 14
  • I don't think that it's possible with only one form control, you need to have 2 form controls, or work with 1 form group with 2 form controls. – Yong Shun Aug 05 '22 at 13:19
  • Create a custom control component via control value accessor. See https://stackoverflow.com/a/57280011/4711754 – Andrew Allen Aug 05 '22 at 14:53
  • 1
    Post how are you setting the value to the input once the page loads. Also your object is confusing, what is `Value`? is it like `value: { name: string; mode: number }`? – Andres2142 Aug 05 '22 at 15:11

0 Answers0