Angular : Add cookie consent in your angular project just in 5 minutes

npm install --save cookieconsent

npm install --save ngx-cookieconsent

import {NgcCookieConsentModule} from 'ngx-cookieconsent';

imports: [NgcCookieConsentModule.forRoot(cookieConfig), ...], 

@NgModule({  declarations: [AppComponent, ...],  imports: [NgcCookieConsentModule.forRoot(cookieConfig), ...],    bootstrap: [AppComponent]})

const cookieConfig:NgcCookieConsentConfig = {  cookie: {    domain: 'localhost' // or 'your.domain.com'   },  palette: {    popup: {      background: '#000'    },    button: {      background: '#f1d600'    }  },  theme: 'edgeless',  type: 'opt-out'};

// ...import {NgcCookieConsentModule, NgcCookieConsentConfig} from 'ngx-cookieconsent';const cookieConfig:NgcCookieConsentConfig = {  cookie: {    domain: 'localhost' // or 'your.domain.com' // it is mandatory to set a domain, for cookies to work properly (see https://goo.gl/S2Hy2A)  },  palette: {    popup: {      background: '#000'    },    button: {      background: '#f1d600'    }  },  theme: 'edgeless',  type: 'opt-out'};@NgModule({  declarations: [AppComponent, ...],  imports: [NgcCookieConsentModule.forRoot(cookieConfig), ...],    bootstrap: [AppComponent]})export class AppModule {}

import { Component, OnInit, OnDestroy } from "@angular/core";import {  NgcCookieConsentService,  NgcNoCookieLawEvent,  NgcInitializeEvent,  NgcStatusChangeEvent,} from "ngx-cookieconsent";import { Subscription } from "rxjs";import { RouterExtService } from "./services/routerurlstate.service";@Component({  selector: "app-root",  templateUrl: "./app.component.html",  styleUrls: ["./app.component.scss"],})export class AppComponent implements OnInit, OnDestroy {  title = "app";  //keep refs to subscriptions to be able to unsubscribe later  private popupOpenSubscription: Subscription;  private popupCloseSubscription: Subscription;  private initializeSubscription: Subscription;  private statusChangeSubscription: Subscription;  private revokeChoiceSubscription: Subscription;  private noCookieLawSubscription: Subscription;  constructor(    private ccService: NgcCookieConsentService,    private routerExtService: RouterExtService  ) {    console.log(this.routerExtService.getCurrentUrl());    console.log(this.routerExtService.currentUrl);  }  handleClickSound() {    let x = <HTMLVideoElement>document.getElementById("myAudio");    x.play();  }  ngOnInit() {    // subscribe to cookieconsent observables to react to main events    this.popupOpenSubscription = this.ccService.popupOpen$.subscribe(() => {      // you can use this.ccService.getConfig() to do stuff...    });    this.popupCloseSubscription = this.ccService.popupClose$.subscribe(() => {      // you can use this.ccService.getConfig() to do stuff...    });    this.initializeSubscription = this.ccService.initialize$.subscribe(      (event: NgcInitializeEvent) => {        // you can use this.ccService.getConfig() to do stuff...      }    );    this.statusChangeSubscription = this.ccService.statusChange$.subscribe(      (event: NgcStatusChangeEvent) => {        // you can use this.ccService.getConfig() to do stuff...      }    );    this.revokeChoiceSubscription = this.ccService.revokeChoice$.subscribe(      () => {        // you can use this.ccService.getConfig() to do stuff...      }    );    this.noCookieLawSubscription = this.ccService.noCookieLaw$.subscribe(      (event: NgcNoCookieLawEvent) => {        // you can use this.ccService.getConfig() to do stuff...      }    );  }  ngOnDestroy() {    // unsubscribe to cookieconsent observables to prevent memory leaks    this.popupOpenSubscription.unsubscribe();    this.popupCloseSubscription.unsubscribe();    this.initializeSubscription.unsubscribe();    this.statusChangeSubscription.unsubscribe();    this.revokeChoiceSubscription.unsubscribe();    this.noCookieLawSubscription.unsubscribe();  }}

 cookie: { domain: window.location.hostname, },