ngx-open-web-ui-chat is an open-source Angular component that lets you add AI chat to any application in minutes. The only requirement is a running Open WebUI instance — locally or on a server.
Installation is straightforward. In your Angular project directory: npm install ngx-open-web-ui-chat
Then import the module into your AppModule (or standalone component): import { NgxOpenWebUiChatModule } from 'ngx-open-web-ui-chat';
Add the component to your template: <ngx-open-web-ui-chat apiUrl="http://localhost:3000" model="llama3" placeholder="Ask a question..."></ngx-open-web-ui-chat>
The apiUrl parameter points to your Open WebUI instance. The model parameter is the name of the model loaded in Open WebUI — you can use llama3, mistral, qwen2, or any other Ollama model.
The component handles conversation history within a session, markdown rendering in model responses, and a responsive mobile layout. It is easy to customise via CSS custom properties.
The project is open-source and available on npm. More configuration examples are in the README on GitHub.
Have questions or a feature idea? Open an issue on GitHub or email [email protected].