How could I use ckeditor with Angular2 component?
Doing something like:
import {Component} from 'angular2/core'
@Component({
selector: 'e',
template: `
<textarea name="editor1" id="editor1" rows="10" cols="80">
This is my textarea to be replaced with CKEditor.
</textarea>
<script>
CKEDITOR.replace( 'editor1' );
</script>
`
})
export class E {
}
and printing it in index.html like:
<html>
<head>
<title>Hello</title>
<script src="../ckeditor/ckeditor.js"></script>
<script src="../systemjs/dist/system.src.js"></script>
<script src="../es6-shim/es6-shim.js"></script>
<script src="../angular2/bundles/angular2-polyfills.js"></script>
<script src="../rxjs/bundles/Rx.js"></script>
<script src="../angular2/bundles/angular2.dev.js"></script>
<script src="../angular2/bundles/router.dev.js"></script>
<script src="../angular2/bundles/http.dev.js"></script>
<script src="http://fgnass.github.io/spin.js/spin.min.js"></script>
<script>
System.config({
packages: {
compiled: {
format: 'register',
defaultExtension: 'js'
}
}
});
System.import('../compiled/boot')
.then(null, console.error.bind(console));
</script>
</head>
<body>
Hackathon incoming!
<e>Loading...</e>
</body>
</html>
doesn't work. It works good when I put all the textarea with script code in index.html but I really want to have it in component template. It's like the ckeditor doesn't see the textarea ID when it is in component.
How can I make ckeditor plugin working good with Angular2 component? Thank you
See Question&Answers more detail:os