After installing and importing the Angular tree component, I followed the basic example provided in order to set it up. However, upon following the steps outlined on , I encountered an issue where only the root node is visible without expanding. Could someone please take a look at the code below to identify any potential errors? Your help in understanding this apparent error would be greatly appreciated.
Module:
import { NgModule } from '@angular/core';
import { TreeModule } from 'angular-tree-component';
@NgModule({
imports: [
TreeModule
],
declarations: [],
providers: []
})
export class CourseCreationModule { }
Component:
import { Component, OnInit } from '@angular/core';
import { Router, ActivatedRoute, Params } from '@angular/router';
@Component({
selector: 'app-container',
templateUrl: './container.component.html',
styleUrls: ['./container.component.css']
})
export class ContainerComponent implements OnInit {
tree: any;
constructor() { }
getCourseDetails() {
this.createLessonTree();
}
createLessonTree() {
this.tree = [
{
id: 1,
name: 'root1',
children: [
{
id: 2,
name: 'child1'
},
{ id: 3,
name: 'child2'
}
]
},
{
id: 4,
name: 'root2',
children: [
{ id: 5, name: 'child2.1' },
{
id: 6,
name: 'child2.2',
children: [
{ id: 7, name: 'subsub' }
]
}
]
}
];
}
ngOnInit() {
this.route.params.subscribe(params => {
this.courseId = params['id'];
this.getCourseDetails();
});
}
HTML:
<tree-root [nodes]="tree"></tree-root>
Based on my initial assessment, there seem to be no syntax errors since both root1 and root2 are visible.
Thank you for your assistance.