Ronald Hove ronald-hove

## main.css
.card{
  border-radius: 0;
  background: rgb(29,72,146);
  background: linear-gradient(90deg, rgba(29,72,146,1) 0%, rgba(199,213,237,1) 100%);
}

## index.html
<!doctype html>
<html lang="en">
  <head>
    <!-- Required meta tags -->
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">

    <!-- Bootstrap CSS -->
    <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css" integrity="sha384-ggOyR0iXCbMQv3Xipma34MD+dH/1fQ784/j6cY/iJTQUOhcWr7x9JvoRxT2MZw1T" crossorigin="anonymous">

## editor.component.html
<div name="content" id="editor"></div>

## editor.component.ts
  loadCkEditor() {
    const script = this._renderer2.createElement('script');
    script.type = 'application/javascript';
    script.src =
      'https://cdn.ckeditor.com/ckeditor5/12.4.0/classic/ckeditor.js';
    script.text = `
      ${(script.onload = async () => {
        const CKEditor = (window as any).ClassicEditor;
        const editor = await CKEditor.create(
          document.querySelector('#editor'),

## editor.component.ts
  ...

  ckEditorData;

  constructor(
    private _renderer2: Renderer2,
    @Inject(DOCUMENT) private _document,
  ) {
    this.loadCkEditor();
  }

## editor.component.ts
import { Component, OnInit, Inject, Renderer2 } from '@angular/core';
import { DOCUMENT } from '@angular/common';

## app.component.html
<app-editor></app-editor>

## gist:1bc81a0250b1b70a25095228a5ef919b
ng g c editor -m=app.module

## gist:6ae5f9229d3400b961edd094fcf0b020
ng  g c editor -m=app.module

## gist:688ddb2ec85b1e3f034f4d475257791b
ng new ckeditorDemo
cd ckeditorDemo
ng serve
	.card{
	border-radius: 0;
	background: rgb(29,72,146);
	background: linear-gradient(90deg, rgba(29,72,146,1) 0%, rgba(199,213,237,1) 100%);
	}
	<!doctype html>
	<html lang="en">
	<head>
	<!-- Required meta tags -->
	<meta charset="utf-8">
	<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">

	<!-- Bootstrap CSS -->
	<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css" integrity="sha384-ggOyR0iXCbMQv3Xipma34MD+dH/1fQ784/j6cY/iJTQUOhcWr7x9JvoRxT2MZw1T" crossorigin="anonymous">
	loadCkEditor() {
	const script = this._renderer2.createElement('script');
	script.type = 'application/javascript';
	script.src =
	'https://cdn.ckeditor.com/ckeditor5/12.4.0/classic/ckeditor.js';
	script.text = `
	${(script.onload = async () => {
	const CKEditor = (window as any).ClassicEditor;
	const editor = await CKEditor.create(
	document.querySelector('#editor'),
	...

	ckEditorData;

	constructor(
	private _renderer2: Renderer2,
	@Inject(DOCUMENT) private _document,
	) {
	this.loadCkEditor();
	}
	import { Component, OnInit, Inject, Renderer2 } from '@angular/core';
	import { DOCUMENT } from '@angular/common';