我正在尝试在我的 angular2 应用程序中使用 ng2-ckeditor 组件,但由于某种原因,我不断在控制台中收到错误提示
ORIGINAL EXCEPTION: ReferenceError: CKEDITOR is not defined
这是我的代码。
系统.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);
内容.组件.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 '';
}
}
在这里也可以看到,在我的网络选项卡中,正在加载 CKEditor.js 文件。
有人知道为什么这不起作用吗?
最佳答案
这意味着您的 CKEDITOR JavaScript 没有加载。
文件 CKEditor.js
指的是不包含编辑器本身的 Angular2 组件。该文件是 part of the repo .
所以你需要包括ckeditor.js你自己。
我不确定 line 159 上的情况,它应该检测丢失的 CKEDITOR JavaScript。也许在 CKEditor.js
抛出错误的那一行显示整个错误消息。
关于javascript - ng2-ckeditor 在 angular2 应用程序中不起作用?为什么?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/38266210/