Skip to main content

Azure Application Insights–Set cloud role name in Angular application

I've talked about how to setup Application Insights in an Angular application and also shared how to set the cloud role name in ASP.NET Core to improve the telemetry reporting. Let's build on top of these 2 posts and show you today how to update the cloud role name in an Angular application.

We’ll start by extending our environment.ts file with an extra configuration setting to store the application name:

Once that is done, we need to go the service (app-insights.service.ts) where we create our Application Insights instance. There we need to add a custom telemetry initializer by calling the addTelemetryInitializer method:

Now when we run our Angular application, the cloud role name should be reported correctly to Application Insights.

Popular posts from this blog

XUnit - Assert.Collection

A colleague asked me to take a look at the following code inside a test project: My first guess would be that this code checks that the specified condition(the contains) is true for every element in the list.  This turns out not to be the case. The Assert.Collection expects a list of element inspectors, one for every item in the list. The first inspector is used to check the first item, the second inspector the second item and so on. The number of inspectors should match the number of elements in the list. An example: The behavior I expected could be achieved using the Assert.All method:

Angular --deploy-url and --base-href

As long you are running your Angular application at a root URL (e.g. ) you don’t need to worry that much about either the ‘--deploy-url’ and ‘--base-href’ parameters. But once you want to serve your Angular application from a server sub folder(e.g. ) these parameters become important. --base-href If you deploy your Angular app to a subfolder, the ‘--base-href’ is important to generate the correct routes. This parameter will update the <base href> tag inside the index.html. For example, if the index.html is on the server at /angularapp/index.html , the base href should be set to <base href="/angularapp/"> . More information: --deploy-url A second parameter that is important is ‘--deploy-url’. This parameter will update the generated url’s for our assets(scripts, css) inside the index.html. To make your assets available at /angularapp/, the deploy url should

Azure DevOps/ GitHub emoji

I’m really bad at remembering emoji’s. So here is cheat sheet with all emoji’s that can be used in tools that support the github emoji markdown markup: All credits go to rcaviers who created this list.