Ionic3, angular 4 ion-slide nested ion-scroll not working

I’m building an Ionic app and I have a situation where I’m trying to make ionic tabs which will slide and inside of the first tab I’ve got another custom component tested that has ion-scroll which needs to scroll items to the right.

When i try to scroll the nested component it doesn’t work.

The code looks something like this :

<ion-slide>
    <ion-row>
        <ion-col text-center width-100>
            <custom-component></custom-component>
        </ion-col>
    </ion-row>                                      
</ion-slide>

And inside the custom component I’ve got this code :

<ion-scroll scrollX="true">
    <ion-row class="card-type-container">
        <ion-col width-100>

            <ng-container>
                <ion-grid>
                    <ion-row>
                        <ion-col width-100 no-padding>
                            <p>some text</p>
                        </ion-col>
                    </ion-row>
                </ion-grid>
            </ng-container>

            <ng-container>
                <ion-grid>
                    <ion-row>
                        <ion-col width-100 no-padding>
                            <p>some other text</p>
                        </ion-col>
                    </ion-row>
                </ion-grid>
            </ng-container>

        </ion-col>
    </ion-row>
</ion-scroll>