角树组件无法正常工作

时间:2017-09-25 09:48:18

标签: javascript angular typescript angular-tree-component

我安装并导入了角树组件,并尝试使用https://angular2-tree.readme.io/

中的步骤提供的基本示例进行设置

但遗憾的是我只看到根节点而没有扩展。如果出现任何问题,发布代码有人可以看到蝙蝠吗?请帮助我理解我以前无法看到的错误。

模块:

import { NgModule } from '@angular/core';
import { TreeModule } from 'angular-tree-component';

@NgModule({
  imports: [
    TreeModule
  ],
  declarations: [],
  providers: []
})
export class CourseCreationModule { }

组件:

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>

相信没有sytax错误,因为我看到root1root2

谢谢。

3 个答案:

答案 0 :(得分:3)

Ch1_Notes.lisp:27:5: error: The LET binding spec (IF POS (CONS POS (ALL-POS ITEM SEQ (+ 1 POS))) NIL) is malformed. Compilation failed. 添加到@import '~angular-tree-component/dist/angular-tree-component.css';文件并工作。

答案 1 :(得分:1)

我认为您需要在构造函数或getCourseDetails()中调用ngOnInit(),这应该作为类声明状态实现。

答案 2 :(得分:0)

如果迁移到 @circlon/angular-tree-component 后出现此问题,您应该在 @import '~@circlon/angular-tree-component/css/angular-tree-component.css' 中使用 src/styles.css。 另见:changelog