Huge News!Announcing our $40M Series B led by Abstract Ventures.Learn More
Socket
Sign inDemoInstall
Socket

ckeditor4-angular

Package Overview
Dependencies
Maintainers
1
Versions
33
Alerts
File Explorer

Advanced tools

Socket logo

Install Socket

Detect and block malicious and high-risk dependencies

Install

ckeditor4-angular

Official CKEditor 4 component for Angular.

  • 1.0.0
  • Source
  • npm
  • Socket score

Version published
Weekly downloads
6.6K
decreased by-53.47%
Maintainers
1
Weekly downloads
 
Created
Source

CKEditor 4 WYSIWYG editor Angular component Tweet

npm version GitHub tag

Build Status Dependency Status devDependency Status

Join newsletter Follow Twitter

Official CKEditor 4 WYSIWYG editor component for Angular.

We are looking forward to your feedback! You can report any issues, ideas or feature requests on the integration issues page.

CKEditor 4 screenshot

Usage

In order to create an editor instance in Angular, install the ckeditor4-angular npm package as a dependency of your project:

npm install --save ckeditor4-angular

After installing, import CKEditorModule to your application:

import { CKEditorModule } from 'ckeditor4-angular';

@NgModule( {
    imports: [
        ...
        CKEditorModule,
        ...
    ],
    …
} )

You can now use the <ckeditor> tag in the component template to include the rich text editor:

<ckeditor data="<p>Hello, world!</p>"></ckeditor>

The data attribute used in the example above is responsible for setting the editor’s data.

Documentation and examples

See the CKEditor 4 Angular Integration article and Angular examples in the CKEditor 4 documentation.

Browser support

The CKEditor 4 Angular component works with all the supported browsers except for Internet Explorer 8-10.

Supported Angular versions

The integration can be used together with Angular at version 5.0.0 and higher. It is an implication of Angular metadata produced for this package by the Angular builder. Note that the package.json used in the main repository isn't published on NPM (the production one is present in src/ckeditor/package.json), so there are only a few peer dependencies:

  • @angular/core >= 5.0.0
  • @angular/common >= 5.0.0
  • @angular/forms >= 5.0.0

required by this package.

Contributing

Here is how you can contribute to the development of the component. Any feedback and help will be most appreciated!

Reporting issues and feature requests

All issues and feature requests should be reported in the issues section of the official GitHub repository for the CKEditor 4 Angular integration.

Development

Clone the CKEditor 4 Angular integration repository.

Once you have cloned it, install dependencies by running:

npm install
The structure of the repository

This repository contains the following code:

  • ./src/ckeditor contains the CKEditor component,
  • ./src/app is a demo application using the component.
Development server

Run ng serve to start the development server. Navigate to http://localhost:4200/. The app will automatically reload if you change any of the source files.

Building samples

Run ng build to build the samples. The build artifacts will be stored in the samples/ directory.

Running unit tests

Run npm test to execute unit tests via Karma.

There are two options available to alternate the testing process:

  • url / u - pass custom URL to Karma, for example custom CKEditor 4 build.
  • watch / w - tell Karma to watch for changes.

For example:

npm run test -- -u http://localhost:5000/ckeditor.js -w
Running end-to-end tests

Run ng e2e to execute the end-to-end tests via Protractor.

Publishing

To build and publish the package, run npm run publish.

You can also manually build the package with npm run build-package which will be stored in dist/. Then you can publish it with npm publish dist/.

License

Copyright (c) 2003-2019, CKSource - Frederico Knabben. All rights reserved.

Licensed under the terms of any of the following licenses at your choice:

For full details about the license, please check the LICENSE.md file.

Keywords

FAQs

Package last updated on 21 Nov 2019

Did you know?

Socket

Socket for GitHub automatically highlights issues in each pull request and monitors the health of all your open source dependencies. Discover the contents of your packages and block harmful activity before you install or update your dependencies.

Install

Related posts

SocketSocket SOC 2 Logo

Product

  • Package Alerts
  • Integrations
  • Docs
  • Pricing
  • FAQ
  • Roadmap
  • Changelog

Packages

npm

Stay in touch

Get open source security insights delivered straight into your inbox.


  • Terms
  • Privacy
  • Security

Made with ⚡️ by Socket Inc