Component doesn't load when using mdbootstrap carousel with angular universal

Question

I have used mdbootstrap carousel with angular universal. The rest components are working fine but i am getting an issue using carousel on homescreen. The homepage doesnt loads, but when i access different page and call the homepage again the page gets loaded.

My homepage componenet HTML file.

<section style="background-color: #00bfff">
  <div class="home">
    <mdb-carousel [isControls]="false" class="carousel slide carousel-fade" [animation]="'fade'">
      <mdb-slide>
        <div class="container-fluid">
          <div class="home-slider">
            <div></div>
            <div class="home-head">
              <p class="home-head-1">Get your personal career coach</p>
              <br>
              <button class="home-button">KNOW MORE</button>
            </div>
            <div>
              <img class="img-fluid home-img mx-auto d-block" src="/assets/images/slider/1.png" alt="boardinfinity" style="margin-bottom:25px;">
            </div>
          </div>
        </div>
      </mdb-slide>
      <mdb-slide>
        <div class="container-fluid">
          <div class="home-slider">
            <div></div>
            <div class="home-head">
              <p class="home-head-1">Get a career boost with great jobs.</p>
              <br>
              <button class="home-button">KNOW MORE</button>
            </div>
            <div>
              <img class="img-fluid home-img mx-auto d-block" src="/assets/images/slider/2.png" alt="boardinfinity" style="position: relative;top: 3px;">
            </div>
          </div>
        </div>
      </mdb-slide>
    </mdb-carousel>
  </div>
</section>

Any help will be much appreciated.

@David Infinite loading with waiting for localhost and i get this on my node console GET / - - ms - - — faizan baig, Apr 12 '18 at 10:38
Did you see t hat thread? Not sure if it's the same problem https://mdbootstrap.com/support/carousel-is-not-working-with-angular-universal/ — David, Apr 12 '18 at 10:42
@David It is working now but now i cannot set interval more than 0, can you help me out with that — faizan baig, Apr 12 '18 at 10:53

score 1 · Answer 1 · edited Jun 20 '18 at 07:14

1

Please try to add [interval]="0" to your <mdb-carousel> element. This should work for you.

edited Jun 20 '18 at 07:14

wscourge

10,657
14
59
80

answered Apr 13 '18 at 07:24

Bloodcast69

226
1
3
10

Component doesn't load when using mdbootstrap carousel with angular universal

1 Answers1