angular / angular/components

mat-tree displaying child value integers as nodes

Abierto
#16,815 5 comentarios 0 reacciones 0 asignados Ver en GitHub
area: material/tree P4 troubleshooting
Lenguaje dominante
TypeScript
Estrellas
25k
Forks
6.8k
Merge medio
1 d 8 h
PR fusionados (30 d)
91

Descripción

I am new to this so please say if this is better posted elsewhere.

I am building a mat-tree on the fly by creating a json string.
The string is:
" {"Politics":[],"Sport":[{"footie":[{"uefa":[]}]},{"sportsub":[]}],"Weather":[{"newdir":[]},{"weathersub":[]}"
It works fine but displays the child level value as an extra level, (see image) how do I lose this?

Code is

private populateTree(workdata) {

var dataObject = JSON.parse(workdata);
// Build the tree nodes from Json object. The result is a list of `FileNode` with nested
// file node as children.
const data = this.buildFileTree(dataObject, 0);
// Notify the change.
this.dataChange.next(data);
}

buildFileTree(obj: { [key: string]: any }, level: number, parentId: string = '0'): FileNode[] {
return Object.keys(obj).reduce((accumulator, key, idx) => {
const value = obj[key];
const node = new FileNode();
node.filename = key;
node.id = `${parentId}/${idx}`;

if (value != null) {
if (typeof value === 'object') {
node.children = this.buildFileTree(value, level + 1, node.id);
} else {
node.type = value;
}
}

return accumulator.concat(node);
}, []);
}

![mat-tree](https://user-images.githubusercontent.com/17275047/63251797-5df06880-c266-11e9-809a-58b753581fe9.png)

Guía de contribución

Abrir la guía de contribución

Línea de trabajo

Empieza reproduciendo el JSON en populateTree y siguiendo buildFileTree, especialmente cómo los valores de objeto se convierten en children y los valores que no son objetos se convierten en node.type. Se considera terminado cuando la jerarquía prevista de mat-tree se renderiza sin el nodo adicional del valor hijo; el issue no indica ningún archivo del repositorio ni ninguna prueba que ejecutar.

Escrito por el modelo de indexación a partir del texto del issue.

Evaluación

Stack tecnológico
angular, typescript
Área
frontend
Tipo de issue
Error
Dificultad
3/5
Tiempo estimado
1-2 días
Estado de actividad
Estancado
Claridad
Necesita aclaración
Aptitud para principiantes
25/100

Recibe los nuevos issues en tu correo

Un resumen breve de issues de GitHub para principiantes.