search

guillotinaweb / ngx-schema-form

HTML form generation based on JSON Schema
MIT License
485 stars 174 forks source link

Render HTML from schema property description #405

Open Jelledb opened 3 years ago

Jelledb commented 3 years ago

Hey 👋

We're using ngx-schema-form to enable our customers to build their own forms, and it's working great so far.

One idea that we had, which would be awesome, is to enable custom HTML insertion via the JSON Schema description. This way you could do custom styling, provide hyperlinks, etc.

Our case would be to create JSON schema properties that contains links to support boards, e.g. 

"paymentId": {
  "type": "string",
  "title": "Payment ID",
  "description": "Enter a valid payment ID. If you're not sure what to enter, please go to our <a href=\"https://docs.acmecorp.com/payment-id-help\">support page</a>"
}

Hint: it should be quite easy to do with Angular's [innerHtml] directive, which also makes sure there's no XSS magic going on.

daniele-pecora commented 3 years ago

Consider creating a custom UI Widget Library. ngx-schema-form has support to use a complete customized UI Widget Library. Here is an example using the Angular Material components: DEMO: https://ngx-schema-form-material.web.app/ Try it yourself at Stackblitz: https://stackblitz.com/edit/angular-9-ngx-schema-form-material-template-9