Angular Treeview on display as per Example

Question

I have followed the installation example from your webpage but not getting the results as per your webpage. What else could be missing here? Thanks

http://ej2.syncfusion.com/15.4.17/angular/documentation/treeview/getting-started.html

The result that i am getting is as shown below. Also installing the module based on the example on the webpage does not install the @syncfusion/ej2-ng-navigations.

npm install @syncfusion/ej2-navigations --save

Piramanayagam Ramakrishnan · Answer

Hi Albert,

Sorry for the inconvenience.

The reported issue is occurred due to TreeView style is not imported in application. To resolve this issue, follow the below steps.

1. Add below TreeView component's styles in top of the page in style.css. Please refer the below code example,

[Style.css]

@import "../node_modules/@syncfusion/ej2-ng-navigations/styles/material.css";

2. Or add below TreeView component's styles using styleUrls tag. Please refer the below code example,

import { Component, ViewEncapsulation } from '@angular/core';

@Component({

selector: 'app-container',

template: `<ej-treeview id='treeelement' [fields]='field'></ej-treeview>`,

styleUrls: ['../../node_modules/@syncfusion/ej2-navigations/styles/material.css'],

encapsulation: ViewEncapsulation.None

})

Please install Syncfusion packages using below command. We will make this correction in our Angular documentation and publish it.

npm install @syncfusion/ej2-ng-navigations --save

Please let us know if you have any other concerns.

Regards,

Piramanayagam R