How to set editor as readonly?

[chengB12]

I'm submitting a

• [X] Regression (a behavior that used to work and stopped working in a new release)
• [ ] Bug report
• [ ] Enhancement
• [ ] Feature request
• [X] Documentation issue or request

Description

I upgrade ngx from 4.x to 10.x, ng build complain that [config] is not property of app-ngx-editor

I used to have [config]="editorConfig", while editorConfig = { editable: false }

Now I didn't found any documentation to bring back editable flag.

I tried [disabled]="true", it seems has no effect at all: https://stackblitz.com/edit/ngx-editor-suinw7?file=src/app/app.component.html

Version Information

ngx-editor: 10.1.0
angular: 12.2.2

Browser

• [X] Chrome - 92
• [ ] Mozilla Firefox - x.x.x
• [ ] Opera - x.x.x
• [ ] Microsoft Edge - x.x.x

[sibiraj-s]

You should be able use disabled property like you do for input components. Let me know if it is not working. I can check.

[chengB12]

you can click the stackbliz link, it has [disabled]="true" yet the toolbar is disabled, however, not main editor body

[sibiraj-s]

Oh. Something might have been broken. I will check, but it was the method.

[sibiraj-s]

@chengB12 . Something is changed how angular handles this I think.

form = new FormGroup({
  editorContent: new FormControl(
    { value: jsonDoc, disabled: true },
    Validators.required()
  ),
});

this works and to programatically update the form, you can use.

this.form.get("editorContent").disable();
this.form.get("editorContent").enable();

[sibiraj-s]

Okay. ☝️ that how you do it for reactive forms. the disabled attribute will work as usual for the rest. Pardon me, I am slightly outdated.

Let me know if there is something else. Feel free to continue the discussion if required. Thanks.

[github-actions[bot]]

This issue has been automatically locked since there has not been any recent activity after it was closed. Please open a new issue for related bugs and link to relevant comments in the thread.