ng2-tinymce-alt

0.0.3 • Public • Published

ng2-tinymce-alt

Angular 2 component for TinyMCE MCE WYSIWYG editor based on 'angular2-tinymce'(https://github.com/Ledzz/angular2-tinymce)". It's alternative package, when use angular-cli - fixed error "Cannot find module 'tinymce/tinymce.js'".

Usage

First, install package via npm:

npm install --save ng2-tinymce-alt

Then copy lightgray skin from here to the /assets folder. So, i.e. there must be available /assets/tinymce/skins/lightgray/skin.min.css file. You can override skin path by specifying skin_url option (default /assets/tinymce/skins/lightgray).

Add these in your angular-cli.json:

"scripts": [ "../node_modules/tinymce/tinymce.js", "../node_modules/tinymce/themes/modern/theme.js", "../node_modules/tinymce/plugins/link/plugin.js", "../node_modules/tinymce/plugins/paste/plugin.js", "../node_modules/tinymce/plugins/table/plugin.js", "../node_modules/tinymce/plugins/advlist/plugin.js", "../node_modules/tinymce/plugins/autoresize/plugin.js", "../node_modules/tinymce/plugins/lists/plugin.js", "../node_modules/tinymce/plugins/code/plugin.js" ]

Import TinymceModule in you app.module.ts:

import { TinymceModule } from 'ng2-tinymce-alt';
 
@NgModule({
    imports: [
        ...
        TinymceModule
    ],
    ...
})
export class AppModule { }

Then use it:

<app-tinymce [formControl]='contentControl'></app-tinymce>

or

<app-tinymce [(ngModel)]='content'></app-tinymce>

Configure

You can configure TinyMCE globally:

import { TinymceModule } from 'ng2-tinymce-alt';
 
@NgModule({
    imports: [
        ...
        TinymceModule.withConfig({
            ...  //any TinyMCE config here
        })
    ],
    ...
})
export class AppModule { }

Please note that config is extended a bit.

  • Besides the original config angular2-tinymce supports baseURL for providing, i.e., custom plugins paths.

  • auto_focus option is boolean instead of string.

  • You cannot specify selector option (and you don't need to, right?).

  • setup and init_instance_callback are executed after the components'.

  • You can view more info about supported options here

Package Sidebar

Install

npm i ng2-tinymce-alt

Weekly Downloads

3

Version

0.0.3

License

ISC

Last publish

Collaborators

  • orosroman