Control type doesn't work with setValue

[ArielGueta]

I have the following form:

    const form = new FormGroup<{
      skills: Control<string[]>
    }>({
      skills: new FormControl(['a', 'b', 'c'])
    });

    form.setValue({ skills: ['1', '2', '3'] })

And I get an error from setValue.

Type 'string[]' is not assignable to type 'Control<string[]>'.   Property '[sym]' is missing in type 'string[]' but required in type 'UniqToken'.

[KostyaTretyak]

Use Control<T> for object type only. Don't use it for an array.

[ArielGueta]

So what should I use?

[KostyaTretyak]

const form = new FormGroup<{ skills: string[] }>({
  skills: new FormArray([new FormControl('a'), new FormControl('b'), new FormControl('c')]),
});

form.setValue({ skills: ['1', '2', '3'] });

[ArielGueta]

Why you're closing the issue? This is not the intended behavior. I have a FormControl with an array value.

[ArielGueta]

A custom control accessor can be FormControl that takes an array.

[KostyaTretyak]

Sorry. In my practice, it has not been the case that FormControl requires an array, but it may really be necessary. Now I will try to fix it. This is a bug.

[KostyaTretyak]

You can do this:

const form = new FormGroup<{ skills: Control<string[]> }>({
  skills: new FormControl(['a', 'b', 'c']),
});

form.get('skills').setValue(['1', '2', '3']);

[ArielGueta]

Yes, but In reality, I have more properties in the group so it's more convenient to use setValue on the group. I'll wait for a fix. Thanks.

[ismailkoksal]

Having the same problem

interface ProfileForm {
  name: string;
  availableWays: Control<Way[]>;
  displayedWays: Control<Way[]>;
}

this.form = this.fb.group<ProfileForm>({
      name: [{value: '', disabled: true}],
      availableWays: [{value: [], disabled: true}],
      displayedWays: [{value: [], disabled: true}]
    });

this.form.reset({
      name: '',
      availableWays: [...this.ways], // ERROR : Type 'Way[]' is not assignable to type 'Control<Way[]>'.   Property '[sym]' is missing in type 'Way[]' but required in type 'UniqToken'.
      displayedWays: [], // ERROR : Type 'Way[]' is not assignable to type 'Control<Way[]>'.   Property '[sym]' is missing in type 'Way[]' but required in type 'UniqToken'.
    });

This is working :

this.form.reset({
      name: '',
      availableWays: [...this.ways],
      displayedWays: [],
    } as ProfileForm);