rea-tinymce v1.0.14
angular2-tinymce
Now compatible with Angular 4.0.1 with AOT support!
Usage
First, install package via npm:
npm install --save angular2-tinymceThen 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).
Import TinymceModule in you app.module.ts like this:
import { TinymceModule } from 'angular2-tinymce';
@NgModule({
imports: [
...
TinymceModule.withConfig({})
],
...
})
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 'angular2-tinymce';
@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
baseURLfor providing, i.e., custom plugins paths.auto_focusoption is boolean instead of string.- You cannot specify
selectoroption (and you don't need to, right?). setupandinit_instance_callbackare executed after the components'.- You can view more info about supported options here
Plugins
If you need other plugins than standart (link paste table advlist autoresize lists code) you should create plugins folder in the baseURL (default '/assets/tinymce') and place your plugins in it.
Example:
Place emoticons plugin to an /assets/tinymce/plugins folder, then:
import { TinymceModule } from 'angular2-tinymce';
@NgModule({
imports: [
...
TinymceModule.withConfig({
plugins: ['emoticons'],
toolbar: 'emoticons'
})
],
...
})
export class AppModule { }Alternativaly you can npm install tinymce --save and import plugins like that:
import 'tinymce/plugins/emoticons/plugin.js';Contributing
Please feel free to leave your PRs, issues, feature requests.
Upcoming features
- Tinymce configuration
- Aot support
- Per-editor configuration
- Add github pages demo
- File uploading
- Events
- Tests