Question

当尝试将angular-tree-component集成到使用＆＃34; dotnet new angular＆＃34;创建的项目时，我一直遇到异常＆＃34; void（0）不是函数。＆＃34 ;树永远不会出现，或者它会短暂出现，但随后错误发生并消失。我想这是由于包版本问题，因为该组件自己的演示工作正常。但我不知道哪个包，或者解决方法可能是什么。

我cross-posted this as an issue to the angular-tree-component forums并且还以public repo进行了各种尝试。

有什么想法吗？

Answer 1

我刚刚亲自对其进行了测试，并且正在使用Chrome版本73.0.3683.86。我使用过Visual Studio代码，但您可以使用任何您想要的东西。

创建一个文件夹并使用VS Code打开它
打开终端并执行dotnew new angular命令-这将创建一个.net核心应用程序
执行ng new tree-test命令-它创建一个角度应用名称树测试。提示时选择yes，然后选择scss格式
执行cd tree-test-将工作文件夹更改为新创建的角度应用程序
执行npm install --save angular-tree-component-这会将您的组件安装到应用程序中
打开tree-test>src>styles.scss文件并在其中添加一行：@import '~angular-tree-component/dist/angular-tree-component.css';-这将使您的树样式起作用
打开app.module.ts文件，然后将import { TreeModule } from 'angular-tree-component';添加到标题中，并按如下所示设置导入：imports: [..., TreeModule.forRoot()]
打开app.component.html文件，然后将所有内容替换为<tree-root [nodes]="nodes" [options]="options"></tree-root>
打开app.component.ts并将所有AppComponent类内容替换为以下内容：

nodes = [
    {
      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' }
          ]
        }
      ]
    }
  ];
  options = {};

运行ng serve命令，等待其完成，然后在http://localhost:4200中打开浏览器。您会在那里看到一棵漂亮的树。

在＆＃34; dotnet new angular＆＃34;中使用角树组件。项目？

1 个答案: