1

Hola estoy tratando de crear un array nuevo basado en otro array de objetos que dentro de sus key tiene otro array de objetos. Para explicarme. Tengo la siguientes interfaces:

export interface  RouteElement{
  component?:  Type<any>;
  path: string;
  label: string;
  data?:{ message?: string}

}

export interface  RouterNodeElement{
  label: string;
  children: RouteElement[]
}

y tengo el siguiente array

routerNodes: [ { label: "NodeRoute", children: [ { path: 'child', label: 'child',  data: { message: 'child' }}] } ]

entnces basicamente tengo un array de routerNodes con el key dentro de children y lo que quiero es extraer todo los children y crear un nuevo arreglo con cada children de cada routerNodel pero no encuentro la forma de aplanar ese objeto.

trate la siguiente forma pero no funciono:

  const flatRouterNodes = this.routerNodes.map( route => {
    return route.children.map( child => child);
  });

todo lo que obtube fue

introducir la descripción de la imagen aquí

1 respuesta 1

2

Podrías usar flatMap en vez de map.

Como su nombre sugiere el método flatMap realiza un map de un Array y luego aplica un proceso de flatten sobre cada elemento del Array que se está iterando. En tu caso particular, tienes un Array de routerNodes y cada elemento de routerNodes tiene a su vez un Array de children. Tu quieres obtener todos los objetos children de cada uno de los routerNode en un solo Array (flat).

Por ejemplo:

const routerNodes = [
  {
    label: "NodeRoute",
    children: [
      {
        path: 'child1',
        label: 'child1',
        data: { message: 'child1' }
      },
      {
        path: 'child2',
        label: 'child2',
        data: { message: 'child2' }
      }
     ]
   },
   {
    label: "NodeRoute",
    children: [
      {
        path: 'child3',
        label: 'child3',
        data: { message: 'child3' }
      }
     ]
   }
 ];
 
const childrens = routerNodes.flatMap(node => node.children);
 
console.log(childrens);
.as-console-wrapper {
  min-height: 100%;
  top: 0;
}

Espero que esto te ayude a resolver el problema.

Tu Respuesta

By clicking “Publica tu respuesta”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

¿No es la respuesta que buscas? Examina otras preguntas con la etiqueta o formula tu propia pregunta.