ngx-omniview

A universal content viewer for Angular Renders any raw string input as Plain Text, HTML, Markdown, LaTeX, MathJax, JSON, and more... all from a single component.

---

Note

• This README is a developer guide for developers contributing to or building the ngx-omniview library.
• For end-user documentation (installation, usage, API), see projects/ngx-omniview/README.md.

---

Warning

This project is currently in active development. While we strive for stability, you may encounter bugs or unexpected behavior.

🐛 Found an issue? Please report it so we can improve!
💡 Have a suggestion? We'd love to hear your feedback!

---

Usage

<omniview [data]="content" [format]="'markdown'"></omniview>

Setup

npm install
ng build ngx-omniview    # Build library
ng serve demo            # Run demo app

Development

Command	Purpose
ng build ngx-omniview	Build the library
ng build ngx-omniview --watch	Hot build on changes (to use during development)
ng build ngx-omniview --configuration production	Build the library for production (final check before publish)
ng test ngx-omniview	Run library tests
ng serve demo	Run demo app at http://localhost:4200

Workflow: After changing library code, rebuild with ng build ngx-omniview before testing in demo app.

Project Structure

ngx-omniview/
├── projects/
│   ├── ngx-omniview/          # Library source (published to npm)
│   │   └── src/lib/
│   │       ├── renderers/     # Format renderers (text, html, markdown, etc.)
│   │       └── ngx-omniview.component.ts
│   └── demo/                  # Demo app (not published)
└── dist/ngx-omniview/         # Built library (after ng build)

Contributing

Adding a new format renderer? See renderers/README.md

Quick Guide:

1. Create [format].renderer.ts in projects/ngx-omniview/src/lib/renderers/
2. Register in renderer.registry.ts
3. Test in demo app
4. Submit PR

Publishing

ng build ngx-omniview
cd dist/ngx-omniview
npm publish

Demo App

The demo application is hosted on GitHub Pages and automatically updates whenever changes are pushed to the main branch.

Live Demo: View Demo

The demo app showcases all the features and format renderers available in ngx-omniview.

License

MIT

---

• Report Bug • Request Feature • View on NPM •

Made with ❤️ for Angular