Ngx-quill: Configurable block tag (div, paragraph)

[jadamconnor]

Any ideas on how to implement the solution found here in an Angular 2 project? I'm not fond of the <p><br></p> line on enter. I think the output should look the same as what's shown in the editor.

[KillerCodeMonkey]

you can try if it is working when you do it like described by jason chen.

without the

```// Create your Quill editor like before
var quill = new Quill('#editor');

part.

if you install ngx-quill you get quill and parchment as dependencies.

import * as Quill from 'quill';
const Parchment = Quill.import('parchment');
let Block = Parchment.query('block');

Block.tagName = 'DIV';
// or class NewBlock extends Block {}; NewBlock.tagName = 'DIV';
Quill.register(Block /* or NewBlock */, true);
```

[KillerCodeMonkey]

I added the example to the ngx-quill-demo repository:

• line 3 - 10
  https://github.com/KillerCodeMonkey/ngx-quill-example/blob/master/src/app.component.ts

if you open the demo (https://killercodemonkey.github.io/ngx-quill-example/) --> use the last editor an check you JS-Console. There you can see the changes in that editor instance --> no p-tags. Only divs ;)

[jadamconnor]

Excellent, thank you.

Edit:

import * as Quill from 'quill'; throws 'cannot find module' at runtime.

I'm using angular cli with webpack, by the way.

[jadamconnor]

Apparently, I'm using ng2-quill-editor. Ha! And I know the reason now. [config]="editorConfig" passes a config object to the element with ng2-quill-editor. I couldn't figure out how to pass a config object to ngx-quill. Looking at the component, there is no input for such an object.

[MickL]

As of 2021, is there a more elegant way of doing this @KillerCodeMonkey ? E.g. within the .forRoot() function?