[英]How to add plugins to ng2-ckeditor using TypeScript and Angular 2 ?
[英]ng2-ckeditor not working in angular2 app? Why?
我試圖在我的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 '';
}
}
也可以在這里看到,在我的網絡選項卡中,正在加載CKEditor.js文件。
任何人都知道為什么這不起作用?
這意味着你的CKEDITOR JavaScript沒有加載。
文件CKEditor.js
引用的Angular2組件不包含編輯器本身。 該文件是回購的一部分 。
所以你需要自己包含ckeditor.js 。
我不確定159行的條件,它應該檢測丟失的CKEDITOR JavaScripts。 也許在CKEditor.js
哪一行顯示整個錯誤消息它會引發錯誤。
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.