I want to use editor through which a user can generate a html of the text and send it through api and once it created i also show the text , user can enter text and images. i try to used flora editor but in that i am not able to display the images as it converts the image path. i also try to used kolkovangular editor but through it i am not able to align the image i insert for example i want to align the image in center but i am not able to do it.
can somebody please suggest any free good editor or tell me how can i align a image in my text
you can try https://www.npmjs.com/package/ngx-quill I have s sample code for you https://stackblitz.com/edit/ngx-quill-example-fa6fzy?file=src%2Fapp%2Fapp.component.ts
<div [formGroup]="form">
<quill-editor formControlName="text" (onSelectionChanged)="onSelectionChanged()">
</quill-editor>
</div>
<div [innerHTML]="result"></div>
<button (click)="logForm()">Log</button>
import { Component } from '@angular/core';
import { FormControl, FormGroup } from '@angular/forms';
import Quill from 'quill';
@Component({
selector: 'my-app',
templateUrl: './app.component.html',
styleUrls: ['./app.component.css']
})
export class AppComponent {
form: FormGroup;
result: string;
quillConfig = {
toolbar: {
container: [
['bold', 'italic', 'underline', 'strike'],
[{ size: ['xsmall', 'small', 'medium', 'large', 'xlarge'] }],
[{ align: [] }],
['clean'],
['link']
]
}
};
constructor() {}
ngOnInit() {
this.form = new FormGroup({
text: new FormControl('<p><strong>Hello</strong> World!</p>')
});
}
public onSelectionChanged(): void {
this.result = this.form.get('text').value;
}
}