Question

当我尝试运行给定的示例代码时，我遇到了这个异常：

ckEditor.component.ts：属性＆＃39;内容＆＃39;在类型＆＃39; CkEditorComponent＆＃39;上不存在。导入CKeditor是否有任何错误。大多数plunkr示例和示例程序都是旧的angular2。使用最新的angular2我有上述错误。

在此之前，我也在组件构造函数中获得了this.content的异常，说它未定义

ckEditor.component.ts

WebHostBuilder()

app.module.ts

import { Component } from '@angular/core';

@Component({
  selector: 'ck-editor',
  template: `
  <ckeditor
    [(ngModel)]="ckeditorContent"
    [config]="{uiColor: '#99000'}"
    (change)="onChange($event)"
    (ready)="onReady($event)"
    (focus)="onFocus($event)"
    (blur)="onBlur($event)"
    debounce="500">
  </ckeditor>
  `
})
export class CkEditorComponent{
 constructor(){
    this.ckeditorContent = `<p>My HTML</p>`;
  }
}

main.ts

import { NgModule } from '@angular/core';
import { BrowserModule } from '@angular/platform-browser';
import { FormsModule } from '@angular/forms';
import { CKEditorModule } from 'ng2-ckeditor';


import { CkEditorComponent } from './ckEditor.component';


@NgModule({
    imports: [
        BrowserModule,
        FormsModule,CKEditorModule
    ],
    declarations: [
        CkEditorComponent
    ],
    bootstrap: [CkEditorComponent]
})
export class AppModule { }

system.config.js

import { platformBrowserDynamic } from '@angular/platform-browser-dynamic';
import { AppModule } from './app.module';

platformBrowserDynamic().bootstrapModule(AppModule);

Answer 1

而不是this.content您应该使用this.ckeditorContent变量。因为您将ckeditorContent变量绑定到ckeditor组件。

<ckeditor
[(ngModel)]="ckeditorContent"
...

将ckeditorContent变量添加到您的组件

export class CkEditorComponent{
  ckeditorContent = `<p>My HTML</p>`;
}

最新的Angular2版本，带有CKEditor设置

1 个答案: