Ngx-quill: Full toolbar options from Quilljs

[TauanMatos]

Is there a way to use this full option toolbar or I have to create a custom toolbar?

[KillerCodeMonkey]

You can Pass the formats and Options AS input Binding - Check the readme.

Or simply Set IT one time in the global config also mentioned in the
readme. But You have to define it one time in your own :)

Inspect the sourcecode of the quill Page and try to Grab the modules config
object.

Am Do., 29. Nov. 2018, 19:20 hat Tauan Matos [e-mail]
geschrieben:

Is there a way to use this full option toolbar or I have to create a
custom toolbar?

[image: image]
https://user-images.githubusercontent.com/23512680/49242734-3f052a00-f3ea-11e8-81b6-23f2e2f05e3a.png

—
You are receiving this because you are subscribed to this thread.
Reply to this email directly, view it on GitHub
https://github.com/KillerCodeMonkey/ngx-quill/issues/295, or mute the
thread
https://github.com/notifications/unsubscribe-auth/ACKOYLHPktQH0w9DfcvsgAyJdi-ThFGNks5u0CWJgaJpZM4Y6Pej
.

[KillerCodeMonkey]

did you got it?

[KillerCodeMonkey]

in the quilljs example they build it up with custom toolbar config

modules: {
        'syntax': true,
        'toolbar': [
          [{ 'font': [] }, { 'size': [] }],
          [ 'bold', 'italic', 'underline', 'strike' ],
          [{ 'color': [] }, { 'background': [] }],
          [{ 'script': 'super' }, { 'script': 'sub' }],
          [{ 'header': '1' }, { 'header': '2' }, 'blockquote', 'code-block' ],
          [{ 'list': 'ordered' }, { 'list': 'bullet'}, { 'indent': '-1' }, { 'indent': '+1' }],
          [ 'direction', { 'align': [] }],
          [ 'link', 'image', 'video', 'formula' ],
          [ 'clean' ]
    ]
 }

[test0017]

I have created the above modules in component but with [modules] its not working .

[KillerCodeMonkey]

are there some errors or could you share some code?

And you can checkout the linked demo - example repositories. there you have working examples :)

[patchworkfish]

Hi guys - similarity between this thread and "How to show all available buttons by default? #1335"

I cannot find a complete definition of setting the tool bar options using JSON, extending what is shown by @KillerCodeMonkey above (from the readme).
For example, if I want to show the align buttons next to each other rather then a list, I cannot find how to reference the LEFT align button! The below example shows center and right (found by trial and error) but left does not work! :

 var quillToolbarOptions = [
        ...
        [{ 'align': 'left'}, { 'align': 'center'}, {'align': 'right'}],
        ...
];

[KillerCodeMonkey]

this is a quill issue. and just checkout the quilljs repo and search the code for this:

https://github.com/quilljs/quill/blob/f32aa5f5360e90920d0a4ecf0d029c5135a24975/docs/index.html#L87

align left is the default alignment so it does not has a specific value... try empty string or null

[patchworkfish]

That did solve the specific text-align example there, thanks @KillerCodeMonkey. I had seen that HTML code example, but without your guidance couldn't make the leap.

[KillerCodeMonkey]

no probs 😉

[relidrissihsaini]

is there a possibility to add a table too at toolbar module ?

[KillerCodeMonkey]

This is not Part of quilljs V1. V2 is not stable and i so Not Support that
Version.

So you can Just kick out ngx-quill and use plain quilljs v2.0.0-dev.3

Or try you luck ignoring The Peer dependencies of ngx-quill and Install
quilljs v2 + typings for v2.

relidrissihsaini [e-mail] schrieb am Fr., 4. Sept. 2020,
17:39:

is there a possibility to add a table too at toolbar module ?

—
You are receiving this because you were mentioned.
Reply to this email directly, view it on GitHub
https://github.com/KillerCodeMonkey/ngx-quill/issues/295#issuecomment-687226402,
or unsubscribe
https://github.com/notifications/unsubscribe-auth/AARI4YBM6FL7ZR7L4F752SDSEEC4HANCNFSM4GHI66RQ
.