How to inject angular app in entity form in portal?

(0) Share

Report

Posted on by Community Power Pla... Microsoft Employee

I have following code to load angular app which works in web template:

<app-root></app-root>

But I want to load this map app into a custom entity form which loads in bootstrap modal.

It is possible to achieve it?

Categories:

Power Apps portals

All responses (3)

Answers (1)

Sort by

justinburch Microsoft Employee on at

Like
a
(0)

Report
Copy link

Link copied!

Hi @Anonymous,
No, because your entity form is pre-built HTML and you don't have anywhere to actually place the app-root (e.g., the Page Copy of a 'Web Page' could technically suffice).
However, you can try to create a Web Template (disable header/footer) with the angular components and entity form, add that to a Web Page, and then create a custom modal in your existing Web Page that opens this web page as a modal.
I had issues integrating an entity form into an angular app for a Dynamics Marketing implementation, but I'm not an Angular expert. Instead, I relied on creating my own custom API calls to replace the entity form; you may have to do the same.
This might be because anywhere an entityform is included will automatically include additional necessary files - e.g. make a Web Template with just {% entityform %} and you'll find a few JS files - and I think there might be conflict there.
However, I have seen a team use VueJS to build a custom page and then just map the event triggers of the field changes to a hidden entity form below, so there's obviously some maneuverability there.
Fubar 17 Super User 2026 Season 1 on at

Like
a
(0)

Report
Copy link

Link copied!

I am not an Angular person so can't help much, but people have used Angular with the portal (see https://powerusers.microsoft.com/t5/Power-Apps-Portals/How-to-integrate-an-angular-app-into-portal/m-p/727769#M4466), your difficulty will be that you appear to want to use it in an Entity Form rather than an Entity Form on a Web Page. Whilst the Entity Form itself doesn't give you as much control as when it is a Web Page based form, you can embed a Web Resource (HTML and JS) into your entity form, and via the entity form settings have it render (this is one way to get tags into the popup entity form).
Verified answer

Community Power Pla... Microsoft Employee on at

Like
a
(0)

Report
Copy link

Link copied!

Thanks everyone. I have resolved my problem, like I have added angular app in template file and then hide it and then entity form open in pop up I have just clone the content of the a div which contains angular app and inject that content into a tab I have created in entity form. That works now.