# Angular integration with Elastic APM **URL:** \ **Category:** APM\ **Tags:** rum\ **Created:** [July 13, 2023, 6:59am UTC](https://discuss.elastic.co/t/angular-integration-with-elastic-apm/338285 "2023-07-13T06:59:06Z")\ **Posts on this page:** 5\ **Page:** 1
**Author:** ![Mangesh\_Mathe](https://sea2.discourse-cdn.com/elastic/user_avatar/discuss.elastic.co/mangesh_mathe/32/103371_2.png) [@Mangesh\_Mathe](https://discuss.elastic.co/u/Mangesh_Mathe)\ **Post date:** [July 13, 2023, 6:59am UTC](https://discuss.elastic.co/t/angular-integration-with-elastic-apm/338285/1 "2023-07-13T06:59:06Z")
Hello Team, My elastic setup is on cloud. elastic version : 8.4.2 Angular version: 13.0 Where we have integrated Angular APM client with elastic APM server. We referred the link from documentation, and installed/configured elastic APM. [https://www.elastic.co/guide/en/apm/agent/rum-js/4.x/angular-integration.html](https://www.elastic.co/guide/en/apm/agent/rum-js/4.x/angular-integration.html) Our requirement is to capture all the real time custom events ,app analytics from UI through APM. We want to build dashboards from these data. I can see our APM service is created but can't see each and every events that are happening on UI after drilldown, not all the events were captured. ![image](https://us1.discourse-cdn.com/elastic/original/3X/3/8/38abd0ea5eb520e993ce2193190b1ede9df9d213.png) In above image we can see only agent name is captured but what if I want to create visualization to find the number of downloads per user per day. I think there is no libraries or plugin in elastic APM to capture all the custom events. If yes , please guide me. Thank you in advance! ---
**Author:** ![carly.richmond](https://sea2.discourse-cdn.com/elastic/user_avatar/discuss.elastic.co/carly.richmond/32/104935_2.png) [@carly.richmond](https://discuss.elastic.co/u/carly.richmond)\ **Post date:** [July 13, 2023, 8:39am UTC](https://discuss.elastic.co/t/angular-integration-with-elastic-apm/338285/2 "2023-07-13T08:39:28Z")
Hi @Mangesh_Mathe, Can you give a bit more detail on what you mean by custom events? Is it the case that perhaps you might want to add custom transactions to your code using the RUM agent [similar to this example](https://www.elastic.co/guide/en/apm/agent/rum-js/4.x/custom-transactions.html). ---
**Author:** ![Mangesh\_Mathe](https://sea2.discourse-cdn.com/elastic/user_avatar/discuss.elastic.co/mangesh_mathe/32/103371_2.png) [@Mangesh\_Mathe](https://discuss.elastic.co/u/Mangesh_Mathe)\ **Post date:** [July 13, 2023, 10:05am UTC](https://discuss.elastic.co/t/angular-integration-with-elastic-apm/338285/3 "2023-07-13T10:05:29Z")
I'm explaining this with my requirement. Example: I have one portal where users are login and registered themself by creating account. And downloads anything if available , or button click events. These data I want to capture from our UI through angular and then it will be push further to elastic APM server. ---
**Author:** ![Alberto\_Delgado](https://sea2.discourse-cdn.com/elastic/user_avatar/discuss.elastic.co/alberto_delgado/32/98488_2.png) [@Alberto\_Delgado](https://discuss.elastic.co/u/Alberto_Delgado)\ **Post date:** [July 14, 2023, 9:07am UTC](https://discuss.elastic.co/t/angular-integration-with-elastic-apm/338285/4 "2023-07-14T09:07:52Z")
Hi @Mangesh_Mathe, Thanks for using Elastic APM! The RUM agent (regardless if you use a framework integration or not) supports this out of the box: [Supported Technologies | APM Real User Monitoring JavaScript Agent Reference [5.x] | Elastic](https://www.elastic.co/guide/en/apm/agent/rum-js/current/supported-technologies.html). Please have a read at that document page when possible. (btw, recently we added a small section highlighting where framework integrations shine) > I think there is no libraries or plugin in Elastic APM to capture all the custom events. If you want the agent to capture custom events, you will need to use [custom transactions](https://www.elastic.co/guide/en/apm/agent/rum-js/current/custom-transactions.html). You can also enrich your transactions with [labels](https://www.elastic.co/guide/en/apm/agent/rum-js/current/transaction-api.html#transaction-add-labels) I also recommend you have a look at the [API reference documentation](https://www.elastic.co/guide/en/apm/agent/rum-js/current/api.html) you will see there how you can use leverage RUM agent API to create custom flows: > button click events As mentioned in supported technologies docs, clicks are automatically captured by the agent. You will see that referenced in the UI as a "user interaction" transaction, or "route-change" in case the click triggered a URL change in a SPA. Clicks are only captured if they generate network activity (xhr/fetch) Last but not least, in terms of UI: Bear in mind, that you will need to use the dropdown to filter by transaction type, the default value tends to be "page-load" ![filter-type](https://us1.discourse-cdn.com/elastic/original/3X/e/d/ed2dc4dd0b9c387d5d610075c7f209e9d6337eb8.png) And besides APM, you can also find RUM useful information on the User Experience page: ![section_higlights](https://us1.discourse-cdn.com/elastic/original/3X/8/5/85d71b8a34a89bc72390f2de2b53b691e56e719d.png) Cheers, Alberto ---
**Author:** ![system](https://us1.discourse-cdn.com/elastic/original/3X/1/a/1ac57faf039f6b580b3f104ef42a2a89e41014de.png) [@system](https://discuss.elastic.co/u/system)\ **Post date:** [August 11, 2023, 9:08am UTC](https://discuss.elastic.co/t/angular-integration-with-elastic-apm/338285/5 "2023-08-11T09:08:24Z")
This topic was automatically closed 28 days after the last reply. New replies are no longer allowed.