I was trying to add a CascadeSelect component to my app. I followed the doc (for the V18 since it's the one I use) , and I got the error "Type 'string[]' is not assignable to type 'string'" for the optionGroupChildren.

The stranger part is that in the "API" tab, optionGroupChildren is apparently supposed to be a string. But using a string makes things worse, no more erros, but the component is just broken, displaying empty options.

But in the "Features" tab, each and every examples use an array for the optionGroupChildren property, between square brackets, like so : [optionsGroupChildren]="['states', 'cities']".

I literally took their whole example (both HTML and TS code) and got the error. I tried to remove the square brackets, to put a different string optionsGroupChildren="'states', 'cities'" instead of optionsGroupChildren="['states', 'cities']" but it didn't work.

I was trying to add a CascadeSelect component to my app. I followed the doc (for the V18 since it's the one I use) , and I got the error "Type 'string[]' is not assignable to type 'string'" for the optionGroupChildren.

The stranger part is that in the "API" tab, optionGroupChildren is apparently supposed to be a string. But using a string makes things worse, no more erros, but the component is just broken, displaying empty options.

But in the "Features" tab, each and every examples use an array for the optionGroupChildren property, between square brackets, like so : [optionsGroupChildren]="['states', 'cities']".

I literally took their whole example (both HTML and TS code) and got the error. I tried to remove the square brackets, to put a different string optionsGroupChildren="'states', 'cities'" instead of optionsGroupChildren="['states', 'cities']" but it didn't work.

• typescript
• primeng

2 Answers 2

It was a known bug in the type definitions that has been fixed since version 19.0.2.

If updating PrimeNG to that version is not an option right now, the error can be silenced by casting the expression type to any:

<p-cascadeselect ... [optionsGroupChildren]="$any(['states', 'cities'])" />

(In more complex situations it's worth exploring better options of fixing npm dependencies: patch-package)

Manually modifying the library files, of course, is not a good idea. There's a good chance they'll be overwritten next time someone runs npm install in the project.

What I had to do was going to the librairy files (cascadeselect.d.ts) and change this : optionGroupChildren: string | undefined; to this : optionGroupChildren: any;. And now it works as expected..