Error on click event of Tree component of PrimeNG

Question

I'm getting a error on the click event of the Tree component of PrimeNG. I've followed everything as it is explained in the docs ( https://www.primefaces.org/primeng/#/tree). Worked just fine, except the click event. It doesn't drop the content..

- ERROR TypeError: eventTarget.className.indexOf is not a function -

Screenshot

Service:

getFiles() {
 let url = "https://raw.githubusercontent.com/primefaces/primeng/master/src/assets/showcase/data/files.json";
 return this.http.get(url)
  .toPromise()
  .then(res => <TreeNode[]> res.json().data);
}

component.ts

export class UsersComponent implements OnInit {

 files: TreeNode[];

 constructor(private userService: UserService,
          private httpClient: HttpClient, 
          private nodeService: NodeService) { }  

  ngOnInit() {
    this.nodeService.getFiles().then(files => this.files = files);
 }

  nodeSelect(event) {
    //event.node = selected node
    console.log("Event: "+event);
  }
}

and component.html:

<div class="container" style="margin: 2%">
   <div class="container" style="background-color: white"> 
       <ul> 
          <li *ngFor="let file of files">{{file.label}}</li>
       </ul>
   </div>

   <p-tree [value]="files" (onNodeSelect)="nodeSelect($event)"></p-tree>

Any thoughts? Thanks!

Answer 1

Here I created a Stackblitz with your requirement. In this sample I used httpclient.

Once you select the node you can see the console log with related information. Better you can get this source to your local environment and test it.

Here is the primeng documentation.