How to create carousel in angular 8 using Angular Material?

The first image is what I am getting currently and second is what I actually want

First:-

Second:-

<mat-card class="carousel-data">
    <mat-grid-list cols="2" rowHeight="30px" class="carousel-data" *ngFor="let data of resource let i = index;" (click)="showdata()" >

        <mat-grid-tile>     
           <img class="m-t-0 m-b-0 "[src]="data.img" alt="" width="24">
            <div class="prof-left" style="margin-left: 10px;">
                <p class="m-t-0 m-b-0 bank-name">{{ data.bank_name}}</p>
                <p class="m-t-0 m-b-0 bank-account">{{ data.account_number }}</p>
            </div>
        </mat-grid-tile>
        <mat-grid-tile>
            <div class="prof-right">
                <p class="m-t-0 m-b-0 total-bal">Total Bal</p>
                <p class="m-t-0 m-b-0 total-amount">{{ data.amount }}</p>
            </div>
        </mat-grid-tile>
    </mat-grid-list>
</mat-card>

Steps Needs to follow to achieve Carousel:-

• ng new owl-carousel

• npm install ngx-owl-carousel owl.carousel jquery --save

• Add library files to angular.json:

"styles": [
  "src/styles.css",
  "./node_modules/owl.carousel/dist/assets/owl.carousel.min.css",
  "./node_modules/owl.carousel/dist/assets/owl.theme.default.min.css"
],
"scripts": [
  "./node_modules/jquery/dist/jquery.min.js",
  "./node_modules/owl.carousel/dist/owl.carousel.min.js"
]

• Update app.module.ts file:

import { OwlModule } from 'ngx-owl-carousel';
// Add OwlModule to imports at below section
imports: [BrowserModule, OwlModule],

• Update app.component.ts file

mySlideImages = ['../assets/images/image1.jpg','../assets/images/image2.jpeg','../assets/images/image3.jpg'];   
mySlideOptions = {items: 1, dots: true, nav: true};

• Update app.component.html file:

<owl-carousel [options]="mySlideOptions" [items]="images" [carouselClasses]="['owl-theme', 'sliding']" >
  <div class="item" *ngFor="let image of mySlideImages; let i = index">
    <div>
      <img src={{image}}/>
    </div>
  </div>
</owl-carousel>

For more details have a look at the Carousel demo