Insert slide number and total count between navigation arrows of owl carousel

I have an ngx owl carousel in my angular application with configurations as below:

const carouselOptions = {
 items: 1,
 dots: false,
 nav: true,
 navText: ["<div class='nav-btn prev-slide'></div>","<div class='nav-btn next-slide'></div>"]
};

<owl-carousel [options]="carouselOptions" [carouselClasses]="['owl-theme','row','sliding']">
 <div class="item" *ngFor="let imgUrl of imageList; let i=index">
     <img src={{imgUrl}} alt="image slide" />
 </div>
</owl-carousel>

I have altered the default navigation arrows into custom arrows by using the navText key inside the owl carousel options. What I need is a way to inject the slide numbers as (current slide)/(total slide count) in between this navText arrows of owl carousel.

I tried to check the documentation but they dont have the option to add the step numbers as 1/7 between the navigation arrows.
I have implemented it in a angular application and would like to know a suitable solution to achieve using typescript?