How to use the common ng-template to navigate to the screens for adding and editing a user?

The following two ng-containers are used according to screenMode to add a user and navigate to the corresponding screen to edit. Therefore the code of the both ng-containers are same and only the text of the second anchor tags are different. Instead of writing the same code again and again, I need to use and common ng-template for this.
Therefore, how to enter the correct template for this? The template I created is as follows. Any suggestion would be appreciated.

<ng-container *ngIf=”screenMode == screenStateEnum.ADD_USER”>
<div class=”breadcrumb”>
<ol aria-label=”breadcrumb”>
<li>
<a id=”ep-list”
class=”hyperlink”
(click)=”screenMode = screenStateEnum.VIEW_USER”>View User</a>
</li>
<li>
<a class=”current”>Add new User</a>
</li>
</ol>
</div>
<add-user [screenMode]= “‘add'” [userId]=”selectedRow?.id”
(goToUser)=”refresh()”></-add-user>
</ng-container>

<ng-container *ngIf=”screenMode == screenStateEnum.EDIT_USER”>
<div class=”breadcrumb”>
<ol aria-label=”breadcrumb”>
<li>
<a id=”ep-list”
class=”hyperlink”
(click)=”screenMode = screenStateEnum.VIEW_USER”>View User</a>
</li>
<li>
<a class=”current”>{{selectedRow?.user_name}}</a>
</li>
</ol>
</div>
<add-user [userId]=”selectedRow?.id” [screenMode]= “‘Edit'”
(goToUser)=”refresh()”></add-user>
</ng-container>

Template I created to replace the above code

<ng-template [ngIf]=”screenMode == screenStateEnum.ADD_USER || screenMode == screenStateEnum.EDIT_USER” #userScreens>
<div class=”breadcrumb”>
<ol aria-label=”breadcrumb”>
<li>
<a id=”ep-list”
class=”hyperlink”
(click)=”screenMode = screenStateEnum.VIEW_USER”>View User</a>
</li>
<li>
<a class=”current”>{{screenMode === screenStateEnum.ADD_USER ? Add new User: selectedRow?.user_name}}</a>
</li>
</ol>
</div>
</ng-template>