Angular 2 树只显示根节点 [英] Angular 2 tree only shows root nodes

问题描述

angular2-tree 库有一个简单的

Stack 是 Angular 4、Chrome、Windows 10.

解决方案

您需要从 node_modules\angular-tree-component\distangular-tree-component.css 复制 css 内容并粘贴styles.css 文件中的内容存在于应用程序的 src 文件夹下.

或者，您也可以在 styles.css 文件中添加此语句.

@import '~angular-tree-component/dist/angular-tree-component.css';

这将解决问题.

The angular2-tree library has a straightforward Basic Usage example. However, when I put it into my project, only the root nodes are rendered. In other words, the tree should have parents (rootA, rootB) and children,

export class App {
  nodes = [
    {
      id: 1,
      name: 'rootA',
      children: [
        { id: 2, name: 'child1' },
        { id: 3, name: 'child2' }
      ]
    },
    {
      id: 4,
      name: 'rootB',
      children: [
        { id: 5, name: 'child2.1' },
        {
          id: 6,
          name: 'child2.2',
          children: [
            { id: 7, name: 'subsub' }
          ]
        }
      ]
    }
  ];

But all I see are root nodes.

There are no compilation issues, and I've included the css import:

@import '~angular-tree-component/dist/angular-tree-component.css';

Has anyone had a similar issue?

Stack is Angular 4, Chrome, Windows 10.

解决方案

You need to copy the css content from node_modules\angular-tree-component\distangular-tree-component.css and paste the contents on styles.css file present under src folder of your application.

Or alternatively you can also add this statement in the styles.css file.

@import '~angular-tree-component/dist/angular-tree-component.css'; 

This will solve the problem.

这篇关于Angular 2 树只显示根节点的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！