This is demonstration of how Azure AD authentication can be configured for Angular application

app.module.ts

import { BrowserModule } from '@angular/platform-browser';
import { NgModule } from '@angular/core';
import { HTTP_INTERCEPTORS, HttpClientModule } from '@angular/common/http';
import { MsalModule, MsalInterceptor } from '@azure/msal-angular';	

import { AppRoutingModule } from './app-routing.module';
import { AppComponent } from './app.component';

export const protectedResourceMap: [string, string[]][] = [
  ['https://graph.microsoft.com/v1.0/me', ['user.read']]
];


@NgModule({
  declarations: [
    AppComponent
  ],
  imports: [
    MsalModule.forRoot(
      {
        auth: {
          // This is your client ID
          clientId: 'd471db94-db21-4103-aefa-679cd7435745', 
          // The GUID is your Directory (or tenant) ID
          authority: 'https://login.microsoftonline.com/d26c9159-7165-4322-bf28-6c98626e9619', 
          // This is your redirect URI
          redirectUri: 'http://localhost:4200',  
          postLogoutRedirectUri: "http://localhost:4200",
          navigateToLoginRequestUrl: true,
        },
        cache: {
          cacheLocation: 'localStorage',
          storeAuthStateInCookie: false, // Set to true for Internet Explorer 11
        },
      },
      {
        popUp: false,
        consentScopes: [
          "user.read",
          "openid",
          "profile",
        ],
        unprotectedResources: ["https://www.microsoft.com/en-us/"],
        protectedResourceMap,
        extraQueryParameters: {}
      }
    ),
    BrowserModule,
    AppRoutingModule
  ],
  providers: [],
  bootstrap: [AppComponent]
})
export class AppModule { }