I have a API that returns some data in form of a JSON doc an can have 2 levels, one is the parent and then some parents can have children. Currently i am reading the json doc and use the forEach loop to create new Objects in an Array. As for the child's i check if there is any children in the array and if so pass it to another function to go and parse the Children and then Set the parent with the newly created Document. All seems to work except one thing, when i try to sort my new Array of Object i get an error

The code i use

buildChild(data : any){
let children : QuestionBase<string>[] = []

if( data.children &&  data.children.length > 0){
  data.children.forEach(child => {
    switch(child.type) { 
      case 'TextboxQuestion': { 
        children.push(new TextboxQuestion({
          key: child.key,
          label: child.label,
          value: child.value,
          placeholder: child.placeholder,
          order: child.order,
          required: child.required,
          function: child.function,
          class: child.class,
          style: child.style,
          childhidekey: child.childhidekey,
          childhidevalue: child.childhidevalue
        }))
        break; 
      }
      case 'RadioButtonQuestion': { 
        children.push(new RadioButtonQuestion({
          key: child.key,
          label: child.label,
          value: child.value,
          placeholder: child.placeholder,
          order: child.order,
          required: child.required,
          function: child.function,
          class: child.class,
          style: child.style,
          options: child.options,
          childhidekey: child.childhidekey,
          childhidevalue: child.childhidevalue
        }))
        break; 
      }
      case 'CheckboxQuestion': { 
        this.questions.push(new CheckboxQuestion({
          key: child.key,
          label: child.label,
          value: child.value,
          placeholder: child.placeholder,
          order: child.order,
          required: child.required,
          function: child.function,
          class: child.class,
          style: child.style,
          options: child.options,
          childhidekey: child.childhidekey,
          childhidevalue: child.childhidevalue
        }))
         break; 
      } 
    }}
  )

 // return children
  return of(children.sort((a, b) => a.order - b.order));
      } }

The Error is

Type 'Observable<QuestionBase[]>' is missing the following properties from type 'QuestionBase[]': length, pop, push, concat, and 25 more.

Also maybe there is a better way to do this then my approach, so any pointers are helpful and appreciated

Stackblitz Sample

CodePudding user response：

I went through your stackblitz sample. The problem is in buildChild() method and question-base.ts

1. your question-base.ts declares this as type of children property:

  style: string;
  children?: QuestionBase<T>[]
  childhidekey?: string;

2. but your buildChild method returns an observable:

     // return children
      return of(children.sort((a, b) => a.order - b.order));

To fix this simply remove the of from buildChild, and voila it works