user5882812
user5882812

Reputation: 11

Implementation of CKeditor in Angular2

In my project I need to implement CKeditor with Angular 2. I also need to add extra plugins, link attachment, video, audio etc. Custom plugins I need to add into plugins folder of node_modules/ckeditor or bower_components/ckeditor. If I do with npm or bower, my custom settings for extra plugins will get overridden while doing npm install or bower install. So what is the best way to do this Angular 2. Please help.

Thanks, Dipali

Upvotes: 1

Views: 684

Answers (1)

Aparigraha
Aparigraha

Reputation: 177

You can use this https://github.com/chymz/ng2-ckeditor as a direct implementation of ckeditor in angular2 itself. If you want to use any external libraries, below are the steps to follow:

  • Install the library(use npm as bower will be dead soon:P)

    npm install <modulename/libraryname>

  • Add typescript definitions for the module

    tsd install <modulename/libraryname>

  • Include the script in your index.html or the root html file

    <script src=”node_modules/<modulename/libraryname>/modulename.js”></script>

  • Add the path configuration in systemsjs.config.js so that the
    SystemJs will pick the js source from this path
    System.config({ [...] paths: { module_var: ‘./node_modules/<modulename>/module.js’ } });

  • Import the module in the component you want
    import * as var_name from ‘module_var’;

Now you can use the library inside this component. Hope it works out:)

Upvotes: 1

Related Questions