Bootstrap 4 Carousl with passed parameters - php

Question

is it possible to make a carousel with passed parameters? what i am trying to do is dynamically create a carousel from the items passed to it.
the code is smarty php code that is passing text into the bootstrap code. below is the smarty code.
{iterate from=news item=item}
{$item->getSubject()}
{$item->getIntroText()}
{$item->getText()}
{/iterate}
my bootstrap code is below. I tried playing around with the placement of the smarty iterate code in different places, but I keep getting one large container with multiple carousel items one below the other. what i really want to do is get one container that displays one carousel item and then users can click the carousel navigation links to cycle through all items.
any advice or help appreciated.
{iterate from=news item=item}
<div class="container news-carousel">
<!-- cont 1 -->
<div class="row w-100">
<!-- row -->
<div class="col">
<div id="carousel" class="carousel slide" data-ride="carousel">
<!-- start carousel -->
<ol class="carousel-indicators"> <!-- this this deteminse the little items below not sure we need them-->
<li data-target="#carousel" data-slide-to="0" class="active"></li>
</ol>
<div class="carousel-inner rounded">
<div class="carousel-item active">
<div class="row w-100 p-0 m-0">
<div class="col p-2 m-3 ">
<h5 class="font-weight-bold" >{$item->getSubject()}</h5>
<p class="m-2 p-2" >{$item->getIntroText()}</p>
{if $item->getText()}
<a class="text-info text-capitalise p-1" href="{url page="index" op="newsDetails" path=$item->getNewsId()}">
read more
</a>
{/if}
</div>
</div>
</div>
<a class="carousel-control-prev" href="#carousel" role="button" data-slide="prev">
<span class="carousel-control-prev-icon" aria-hidden="true"></span>
<span class="sr-only">Previous</span>
</a>
<a class="carousel-control-next" href="#carousel" role="button" data-slide="next">
<span class="carousel-control-next-icon" aria-hidden="true"></span>
<span class="sr-only">Next</span>
</a>
</div> <!-- close carousel inner -->
</div> <!-- carousel close -->
</div>
</div>
</div><!-- cont 1 -->
{/iterate}
revised code
...
<!-- we make a new bloc -->
{iterate from=news item=item}
<div class="container">
<div id="carouselExampleSlidesOnly" class="carousel slide" data-ride="carousel">
<div class="carousel-inner">
<div class="carousel-item active">
<p>{$item->getSubject()}</p>
<p>{$item->getIntroText()}</p>
{if $item->getText()}
Read more
{/if}
</div>
</div>
</div>
</div>
{/iterate}
...