Need Help! Horizontal scroll to specific element

HTML

<ion-grid class="cal_bg" *ngIf="list.length > 0">

        <ion-row nowrap class="forecast_container">

            <ion-col col-4 *ngFor="let li of list; let i = index;" [id]="li.id">

                <div class="bold"><span class="b"> {{li.name}} </span> </div>

                <div class="hvy"> <b>{{li.Month}}, {{li.Year}}</b></div>

                <div class="blk">

                    <h2> {{li.Day}}</h2>

                </div>

                <div class="sembld">

                    <h4>{{li.Hours}} : {{li.Min}} {{li.AmPmSwitch}}</h4>

                </div>

            </ion-col>

        </ion-row>

    </ion-grid>

My horizontal scroll is perfectly working but I want to auto scroll horizontally specific to a list ID using angular. So, i can put focus on a particular item after view will load. And there are multiple ion-grid in the page only this ion-grid is horizontally scroll able.


initially 3 tiles will be visible on mobile screen rest will be in horizontal scroll

If any other details are required. kindly let me know.
Thanks