can i build a component which interacts with backend using angular elements? [closed]

Question

I'm currently building a quiz app which uses a component to create a widget using which we can embed to a 3rd party website. This widget GETs questions from database(MongoDB) and POSTs the answers to the database, basically it interacts with my backend. So my question is that angular elements create a javascript file to use in other apps and use the widget using custom tags. So is it possible to create a widget which interacts with backend and sends and retrieves data from it? if so, then where can i find the documentation or relevant material for it. Thanks in advance.

Answer 1

If you need to understand the core concept, try this repo as an example https://github.com/rfprod/nx-ng-starter.

Start here, it's the elements app module https://github.com/rfprod/nx-ng-starter/blob/master/apps/elements/src/app/elements.module.ts

Then check the chatbot module https://github.com/rfprod/nx-ng-starter/blob/master/libs/client-chatbot/src/lib/client-chatbot.module.ts

This component is rendered as a custom web element using angular elements https://github.com/rfprod/nx-ng-starter/blob/master/libs/client-chatbot/src/lib/components/chatbot-root/chatbot-root.component.ts

You can put any logic into the component that's rendered as a custom web element.

Answer 2

Yes, you can. In the end you could create an entire application as a web component using angular-elements.

You can use a service that makes calls to a back end the same way you can in a regular angular application.

Here is an small example of how to use a service with angular-elements. It is not a backend call but you just need to create & use the function the way you need.