CODEWITHSUNDEEP
javascriptangularckeditor
Nitin
Nitin

Reputation: 941

CKeditor component with angular 4

I am a newbie in Angular4

I want to integrate CKeditor in Angular4

As i follow this url but it's for Angular 2 not working in Angular 4.

As i have check there 

System.config({
"map": {
  "ng2-ckeditor": "npm:ng2-ckeditor",
},
"packages": {
  "ng2-ckeditor": {
    "main": "lib/index.js",
    "defaultExtension": "js",
  },
}
});

but there is no any option for System.config in Angular 4

Then i have integrated froala but it gives licence error and also not allow to configure and i tried but it's not effecting

How can i integrate CKeditor in Angular4?

Upvotes: 2

Views: 9262

Answers (1)

lucas
lucas

Reputation: 503

I assume you use angular-cli to create your angular 4 project , you dont need system.config in angular-clli, that only used in system.js, and the code you have there is telling system.js where to find the ckeditor module. in case you not clear, just check whether your project have an 'angular-cli.json' file, if there is, then you can follow the below steps:

  1. use npm install ng2-ckeditor to install the ng2-ckeditor
  2. in your app.module.ts, you should have something like this 
import { BrowserModule } from '@angular/platform-browser';
import { NgModule } from '@angular/core';
import { FormsModule } from '@angular/forms';
import { CKEditorModule } from 'ng2-ckeditor';
import { AppComponent } from './app.component';

@NgModule({
  declarations: [
    AppComponent
  ],

  imports: [
    BrowserModule,
    CKEditorModule,
    FormsModule
  ],

  providers: [],

  bootstrap: [AppComponent]
})

export class AppModule { }

and then

  1. in your index.html add 
<script src="https://cdn.ckeditor.com/4.5.11/full/ckeditor.js"></script>

inside head section. alternatively, you can save the js file inside your project, then insde .angular-cli.json file, add the file of that file into scripts array

then you are good to use ckeditor in your angular 4 project

Upvotes: 6

Related Questions