Question

我已经在新的Angular 2应用程序（rc4）中安装了ng2-tree插件，但是在关注this之后。该插件已安装，位于node_modules文件夹中。

我试图在这个组件中使用它：

import {Component} from '@angular/core';
import {TreeModel, TreeComponent} from "ng2-tree";

@Component({
    selector: 'tree-side',
    templateUrl: '../../pages/tree-side.html',
    directives: [TreeComponent]

})
export class TreeSideComponent{
    private tree: TreeModel = {
        value: 'Programming languages by programming paradigm',
        children: [
            {
                value: 'Object-oriented programming',
                children: [
                    {value: 'Java'},
                    {value: 'C++'},
                    {value: 'C#'}
                ]
            },
            {
                value: 'Prototype-based programming',
                children: [
                    {value: 'JavaScript'},
                    {value: 'CoffeeScript'},
                    {value: 'Lua'}
                ]
            }
        ]
    };
}

但是我在npm控制台上遇到了这个错误：

404 GET /ng2-tree

我已使用以下代码修改了system.config.js，尝试找到解决方法：

var map = {
   ...
    'ng2-tree':                   'node_modules/ng2-tree'
};
// packages tells the System loader how to load when no filename and/or no extension
var packages = {
    ...
    'ng2-tree':                   { defaultExtension: 'js' },
};

但我在以下情况下收到此错误：

Error loading http://localhost:3000/node_modules/ng2-tree as "ng2-tree" from http://localhost:3000/app/pages/tree.component.js

按照Thierry Templier的指示，我尝试了其他配置。包括lodash插件的配置，导致这与修复ng-tree依赖项后的ng-tree有同样的问题。

 var map = {
...
        'ng2-tree':                   'node_modules/ng2-tree',
        'lodash':                   'node_modules/lodash'
    };
    // packages tells the System loader how to load when no filename and/or no extension
    var packages = {
...
        'ng2-tree':                   { main: 'index.js', defaultExtension: 'js' },
        'lodash':                   { main: 'index.js', defaultExtension: 'js' }
    };

但在这种情况下，我得到了：

[1] 16.08.08 12:04:09 404 GET /tree.component.html
[1] 16.08.08 12:04:09 404 GET /node-menu.component.html

Failed to load tree.component.html ; Zone: angular ; Task: Promise.then ; Value: Failed to load tree.component.html

显然这是由于相对路径分辨率所致，但无论如何都不符合这个问题。

Answer 1

我认为您错过了ng2-tree的main配置中的packages属性：

var packages = {
  ...
  'ng2-tree': { main: 'index.js', defaultExtension: 'js' },
};

Answer 2

尝试加载TreeModule时出现问题。我已经解决了这个问题。问题出在@angular/cli版本上。在package.config内的\node_modules\ng2-tree更改

文件中

"devDependencies": {
    "@angular/cli": "1.1.1",
}

到

"devDependencies": {
    "@angular/cli": "#####",// version of your @angular/cli(**You can find it from package.config file in the root folder**)
}

安装在Angular 2新应用程序后找不到NG2树模块

2 个答案: