How to show different content based on URL in JHipster 4

How to show different content based on URL in JHipster 4

I have category-dialog.component.html and category-dialog.component.ts.

In category.component.html, there is a list of categories with buttons Add subcategory and Edit. Both refer to category-dialog.component.

Add subcategory:

[routerLink]="['/', { outlets: { popup: 'barfitter-category/'+ category.id + '/newsub'} }]"

Edit:

[routerLink]="['/', { outlets: { popup: 'barfitter-category/'+ category.id + '/edit'} }]"

I needed different content in each.

In category-dialog.component.ts added:

On top:

import {Router} from '@angular/router';

On top of class:

location = '' ;

Constructor:

    constructor(
        public activeModal: NgbActiveModal,
        private jhiAlertService: JhiAlertService,
        private categoryService: CategoryService,
        private eventManager: JhiEventManager,
      
        private  _router : Router
    ) {
      this.location = _router.url;
    }

Then in category-dialog.component.html added:

<div *ngIf="_router.url.includes('newsub')">Show me something</div>