Angular-tree-component: basic geting started problem

Created on 14 Sep 2017  路  6Comments  路  Source: CirclonGroup/angular-tree-component

i am sure this must be a really basic error on my part but i am lost.
i added the component, i have a copy of the sample nodes and the page shows 3 node names.
view source shows that a lot of markup is in the pages but hidden.
the nodes do not click and do not show colapse / expand icons.

no errors in the javascript console in chrome.
angular cli 4 is the build environment.
app runs and other pages work ok.
the tree is in a simple bootstrap 3 panel.

Most helpful comment

Here is the fix for a project that uses bootstrap and angular cli:

go to the file .angular-cli.json
edit that file
it has a styles section
add the style like this:
"styles": [ "../node_modules/bootstrap/dist/css/bootstrap.css", "../node_modules/angular-tree-component/dist/angular-tree-component.css", "styles.css" ],

then re build and test

ng serve

works!!

All 6 comments

You have to manually import the css of the tree,
add to your style.css file this
@import '~angular-tree-component/dist/angular-tree-component.css';

Here is the fix for a project that uses bootstrap and angular cli:

go to the file .angular-cli.json
edit that file
it has a styles section
add the style like this:
"styles": [ "../node_modules/bootstrap/dist/css/bootstrap.css", "../node_modules/angular-tree-component/dist/angular-tree-component.css", "styles.css" ],

then re build and test

ng serve

works!!

@figuerres, did you try importing the css from styles.css as the docs and @crivadavi suggest?

What I did works and it let's the angular clip build process see the dependacie on that case file.

I'm having the same issue. Just use a @import "~angular-tree-component/dist/angular-tree-component.css"; like @crivadavi says.

@adamkleingit , the docs don't says anything about styles.css.
Check the Getting Started section of the docs.
I think that section must be update.

Fixed - the default docs was 4.1 instead of 5.0

Was this page helpful?
0 / 5 - 0 ratings