Javascript ng2 ckeditor在angular2应用程序中不工作？为什么？

我试图在angular2应用程序中使用ng2 ckeditor组件，但由于某些原因，我在控制台中不断收到一个错误

原始异常：ReferenceError:未定义CKEDITOR

这是我的密码

system.config.json

(function(global) {
    // map tells the System loader where to look for things
    var map = {
        'app':                        'app', // 'dist',
        '@angular':                   'node_modules/@angular',
        'rxjs':                       'node_modules/rxjs',
        'angular2-tree-component':    'node_modules/angular2-tree-component',
        'lodash':                     'node_modules/lodash',
        'ng2-ckeditor':               'node_modules/ng2-ckeditor'
    };
    // packages tells the System loader how to load when no filename and/or no extension
    var packages = {
        'app':                      { main: 'main.js',  defaultExtension: 'js' },
        'rxjs':                     { defaultExtension: 'js' },
        'angular2-tree-component' : { main: 'dist/angular2-tree-component.js', defaultExtension: 'js' },
        'lodash' :                  { main: 'lodash.js', defaultExtension: 'js' },
        'ng2-ckeditor' :            { main: 'lib/CKEditor.js', defaultExtension: 'js' }
    };
    var ngPackageNames = [
        'common',
        'compiler',
        'core',
        'forms',
        'http',
        'platform-browser',
        'platform-browser-dynamic',
        'router',
        'router-deprecated',
        'upgrade'
    ];
    // Individual files (~300 requests):
    function packIndex(pkgName) {
        packages['@angular/'+pkgName] = { main: 'index.js', defaultExtension: 'js' };
    }
    // Bundled (~40 requests):
    function packUmd(pkgName) {
        packages['@angular/'+pkgName] = { main: '/bundles/' + pkgName + '.umd.js', defaultExtension: 'js' };
    }
    // Most environments should use UMD; some (Karma) need the individual index files
    var setPackageConfig = System.packageWithIndex ? packIndex : packUmd;
    // Add package entries for angular packages
    ngPackageNames.forEach(setPackageConfig);
    var config = {
        map: map,
        packages: packages
    };
    System.config(config);
})(this);

content.component.ts

import { Component, Input } from '@angular/core';
import { Content } from './models/content';
import { CKEditor } from 'ng2-ckeditor';

@Component({
    selector: 'content',
    template: '<ckeditor [(ngModel)]="content.text" [config]="{ uiColor: '#99000' }" debounce="500"></ckeditor>',
    directives: [ CKEditor ]
})

export class ContentComponent {

    @Input()
    content: Content;

    active: number = 1;
    sizes: number[] = [ 12, 11, 10, 9, 8, 7, 6, 4, 5, 3, 2, 1 ];

    getAnchor() {
        return '';
    }
}   

从'@angular/core'导入{Component，Input}；
从“./models/Content”导入{Content}；
从'ng2 CKEditor'导入{CKEditor}；
@组成部分({
选择器：“内容”，
模板：“”，
指令：[编辑]
})
导出类ContentComponent{
@输入（）
内容：内容；
活动：编号=1；
大小：数字[]=[12,11,10,9,8,7,6,4,5,3,2,1]；
getAnchor（）{
返回“”；
}
}   

这里还可以看到，在我的网络选项卡中，正在加载CKEditor.js文件

---

有人知道这为什么不起作用吗？

这意味着您的CKEDITOR JavaScript没有加载

文件

CKEditor.js

引用了不包含编辑器本身的Angular2组件。那个文件是

所以你需要包括你自己

---

我不确定上的条件，它应该检测缺失的CKEDITOR JavaScripts。可能会在抛出错误的

CKEditor.js中的哪一行上显示整个错误消息。
请参阅这可能有助于我现在通过npm
npm install CKEditor--save安装了CKEditor。我也可以通过systemjs加载吗？我肯定你不能。CKEditor不支持任何模块系统，因此您必须将其包含在
中。