Warning: Use of undefined constant MDB_STRIPE_SUB_WEBHOOK_SECRET - assumed 'MDB_STRIPE_SUB_WEBHOOK_SECRET' (this will throw an Error in a future version of PHP) in /var/www/acc01/wp-content/themes/mdbootstrap4/inc/mdb-subscriptions/mdb-payments/stripe/class-mdb-stripe-webhook.php on line 26

Notice: Undefined index: HTTP_REFERER in /var/www/acc01/wp-content/themes/mdbootstrap4/inc/cookie-setter.php on line 8
Angular Mobile Carousel - Bootstrap 4 & Material Design. - Material Design for Bootstrap

Angular Mobile Carousel

Angular Mobile Carousel - Bootstrap 4 & Material Design

Carousels are a great way to get your attention to something. Use full page carousels to force interaction from the user.

Basic example

Swipe left or right to change the carousel current image. The carousel has no looping action. If you reach the last slide, you will not be able to move it forward but backwards.

Android carousel
iOS carousel

          <mdb-carousel [duration]="400">
              <Image src="https://wallpaperaccess.com/full/167767.jpg" stretch="fill"></Image>
              <Image src="https://i.pinimg.com/originals/1c/86/0f/1c860f088d5179a3780cf51f9e88ab0b.jpg" stretch="fill"

Angular Mobile Carousel - API

In this section you will find informations about carousel and its required modules and available inputs, outputs, methods and events.

Modules used

In order to speed up your application, you can choose to import only the modules you actually need, instead of importing the entire MDB Angular Mobile library. Remember that importing the entire library, and immediately afterwards a specific module, is bad practice, and can cause application errors.

    // MDB Angular Mobile Free
    import { MdbCarouselModule } from 'mdb-angular-mobile'



Selector: mdb-carousel

Type: MdbCarouselComponent


Name Type Default Description Example
duration number 400 Allow to modify the slide animation duration. Takes time in ms. duration="1000"