Home » Java » java – how create tree in angular 7 and spring boot?-Exceptionshub

java – how create tree in angular 7 and spring boot?-Exceptionshub

Posted by: admin February 25, 2020 Leave a comment

Questions:

i write method in spring boot (java 8) and get model for tree .
I want to write a tree with Angular, but apparently my output doesn’t read with primeNg and it doesn’t show anything in the display.
Now how to make this format? The output of my Java method is modeled and shown below:

code :

@GetMapping(value = "/createTree")
    public Department createTree() {
        try {
            List<Department> departments = saveDepartments();
            Map<Long, Department> mapTmp = new HashMap<>();
            for (Department current : departments) {
                mapTmp.put(current.getId(), current);
            }
            for (Department current : departments) {
                Long parentId = current.getParentId();
                if (parentId != null) {
                    Department parent = mapTmp.get(parentId);
                    if (parent != null) {
                        current.setParent(parent);
                        parent.addChild(current);
                        mapTmp.put(parentId, parent);
                        mapTmp.put(current.getId(), current);
                    }
                }
            }
            Department root = null;
            for (Department department : mapTmp.values()) {
                if (department.getParent() == null) {
                    root = department;
                    break;
                }
            }
            return root;
        } catch (Exception e) {
            e.printStackTrace();
            return null;
        }
    }


public List<Department> saveDepartments() throws CustomException {
            Department department1 = new Department("Five", 5L, 4L);
            Department department2 = new Department("Four", 4L, 2L);
            Department department3 = new Department("Two", 2L, 1L);
            Department department4 = new Department("Three", 3L, 2L);
            Department department5 = new Department("One", 1L, null);  

            List<Department> departments = new ArrayList<>();
            departments.add(department1);
            departments.add(department2);
            departments.add(department3);
            departments.add(department4);
            departments.add(department5);
            for (Department department : departments) {
                departmentService.saveDepartment(department);
            }
            return departments;
        }

public class Department {

    private Long id;           
    private Long parentId;  
    private String value;
    private Department parent;
    private List<Department> children;

    public Department() {
        super();
        this.children = new ArrayList<>();
    }

    public Department(String value, Long childId, Long parentId) {
        this.value = value;
        this.id = childId;
        this.parentId = parentId;
        this.children = new ArrayList<>();
    }

    public void addChild(Department child) {
        if (!this.children.contains(child) && child != null)
            this.children.add(child);
    }

    @Override
    public String toString() {
        return "data [id=" + id + ", parentId=" + parentId + ", value=" + value + ", children="  + children + "]";
    }
}

output :

data [id=1, parentId=null, value=One, children=[data [id=2, parentId=1, value=Two, children=[data [id=4, parentId=2, value=Four, children=[data [id=5, parentId=4, value=Five, children=[]]]], data [id=3, parentId=2, value=Three, children=[]]]]]]

now i want show this result to angular 7 and create tree,
but dont map this result with angular and dont show . why ?

angular code:

<p-tree [value]="filesTree" layout="horizontal" selectionMode="single" [(selection)]="selectedFile" ></p-tree>

selectedFile: TreeNode;
  filesTree: TreeNode[];

  ngOnInit() {
    this.createTree().then(files => {
      this.filesTree = [{
        label: 'Root',
        children: files
      }];
    });
  }

  createTree() {
    return this.http.get<any[]>('/api/createTree', {headers: this.header})
      .toPromise()
      .then(res => <TreeNode[]> res);
  } 

please help me ,
thanx

How to&Answers: