Ionic2 + Ng2-CKEditor - No value accessor error


#1

I am having issues getting the CKEditor into my app. I hope someone could help me. I am using the Tab tutorial app for testing. Beta 11. To install the editor, I ran:

npm install ng2-ckeditor --save

Then, I put it in the About.ts file:

import {Component,OnInit} from '@angular/core';
import {NavController} from 'ionic-angular';
import {CKEditorModule} from 'ng2-ckeditor';

@Component({
  templateUrl: 'build/pages/about/about.html'
})
export class AboutPage implements OnInit {
  description:string="My test description";
  constructor(private navCtrl: NavController) {
  }

  ngOnInit(){
    this.description="Initialized Test Description";
  }
}

…and About.html ion-content:

<ion-content padding class="about">
  <ckeditor name="desc"
    [(ngModel)]="description"
    debounce="500">
  </ckeditor>
</ion-content>

When it runs, it throws the error "No value accessor for ‘’ ". If I remove [(ngModel)], there is no error, but also no editor displayed. Has anyone used this text editor successfully? I am following what is given here: https://github.com/chymz/ng2-ckeditor

I am not sure about the @NgModule section. Is that what is missing? I haven’t been able to figure out where that would go in the Tabs tutorial.


#2

Did you ever get CKEditor working with Ionic 2? I’m trying now with the RC with no luck…


#3

I haven’t gotten it working yet. I haven’t tried it in RC so if you get it working, please post and I will do the same.


#4

#5

Thanks for the help. I made these changes and now I’m getting this error on bundle: ‘CKEditorModule’ is not exported by node_modules\ng2-ckeditor\lib\index.js (imported by src\app\app.module.ts)

Here is what is in node_modules\ng2-ckeditor\lib\index.js:

"use strict";
function __export(m) {
    for (var p in m) if (!exports.hasOwnProperty(p)) exports[p] = m[p];
}
__export(require('./ckeditor.module'));
__export(require('./ckeditor.component'));
//# sourceMappingURL=index.js.map

Is this related to using Typescript vs Javascript? Am I missing some config settings?


#6

Try to comment all of that and replace with this,

export * from ‘./ckeditor.module’;
export * from ‘./ckeditor.component’;


#7

I finally got CKEditor working with Ionic 2. The new build process seemed to fix it:

http://blog.ionic.io/ionic-build-process-updates/

I’m using the following:

https://www.npmjs.com/package/ckeditor


https://github.com/DefinitelyTyped/DefinitelyTyped/tree/master/ckeditor

No imports required outside of the CKEditorModule component in app.module.ts. The template object does it all.

EDIT: Correction, I don’t have it working completely yet, I was relying on this in my index.html:

<script src="http://cdn.ckeditor.com/4.5.8/full/ckeditor.js"></script>

I can’t seem to load all the required files from the npm library ‘ckeditor’.

import "ckeditor"; seems to miss all the dependencies…


#8

did you get working without the import?