Carousel: proper data is not getting passed to the component ts file from the carousel when clicked on any event on the particular carousel

[likhita-naik]

Describe the bug

Using the component P-carousel ,table of carousels are displayed,
data structure is like this
Main data is observable of array,For each object of main array ,carousel of slides need to display as each object contains the array data which needs to be displayed in carousel
According to the logic carousels are rendering properly,but when i click on the any event related to particular carousel ,the respective carousel data is not getting passed to the respective bounded function, sometimes its taking only the first row's first carousel data on clicking on any carousel , sometimes its taking some random carousel's data,
If carousels are rendering properly in view (html) according to the logic, then for bounded function of each carousel, respective data should get passed, but that is not happening.

Environment

angular-15,vscode,ubuntu

Reproducer

No response

Angular version

15.0.0

PrimeNG version

15.4.1

Build / Runtime

Angular CLI App

Language

TypeScript

Node version (for AoT issues node --version)

16.20.2

Browser(s)

chrome

Steps to reproduce the behavior

{{data.SNo}}.{{d.index}}

                                                    <button class="btn btn-sm  mt-2"
                                                        (click)="imageCarousal(d)">&nbsp;&nbsp;
                                                        <fa-icon icon="images" class="mr-1"></fa-icon> More
                                                        Images
                                                        &nbsp;&nbsp;</button>
                                                           &nbsp;<button class="btn btn-sm default text-white mt-2"
                                                        (click)="downloadImage(API+'/image/'+d.imagename)">
                                                        Download
                                                        Image
                                                        <fa-icon icon="download" class="ms-1 me-1"
                                                            style="cursor: pointer;"></fa-icon>
                                                    </button>
                                                </div>
                                            </div>
                                            <div class="d-flex justify-content-center align-items-center">
                                                <div>
                                                    <div *ngFor="let object of d.object_data;let in=index"
                                                        ngClass="in!= (d.object_data.length-1) ? 'border-bottom':''">

                                                        <div>
                                                            <div class="mb-3">{{object.violation_count}} </div>
                                                            <ul class="list-unstyled">
                                                                <li>
                                                                    <div *ngFor="let key of objectKeys(object);">
                                                                        <div class="items"
                                                                            *ngIf="(key==='Helmet'?object[key]==='none'?false:object[key]===false?true:false:key.toLowerCase()==='vest'?object[key]!=='vest'?true:false:false)">
                                                                            <input id="item1" type="checkbox"
                                                                                [checked]="key==='Vest'?object[key].toLowerCase()=='vest'?true:false:object[key]">
                                                                            <label
                                                                                for="item1">{{key==='Vest'?'Vest':key}}</label>
                                                                        </div>

                                                                    </div>
                                                                </li>
                                                            </ul>
                                                        </div>
                                                    </div>
                                                </div>
                                            </div>
                                            <div class="d-flex justify-content-center align-items-center">
                                                {{d.camera_name?d.camera_name:'null'}}
                                            </div>

                                            <div class="d-flex justify-content-center align-items-center">
                                                {{d.timestamp|dateFormater}}
                                            </div>

                                            <div *ngIf="isEditTable" id="verify" style="width:5rem"
                                                class="d-flex justify-content-center align-items-center">
                                                <div *ngIf="!d.violation_verificaton_status;else verified">
                                                    <div class="" id="right">
                                                        <input type="radio" [value]=0
                                                            (change)="VerifyTrueViol($event,d,data.SNo)" [defaultValue]=true
                                                            id="yes" class="">
                                                        <label for="yes" class="form-check-label text-success">Yes
                                                        </label>
                                                    </div>
                                                    <div class="" id="wrong">
                                                        <input type="radio" [value]=1
                                                            (change)="VerifyFalseViol($event,d,data.SNo)"
                                                            [defaultValue]=false id="no" class="">
                                                        <label for="no" class="form-check-label text-danger">No
                                                        </label>
                                                    </div>
                                                </div>
                                                <ng-template #verified>
                                                    <div class="success-badge w-full mt-3">Verified</div>
                                                </ng-template>
                                            </div>
                                            <div class="d-flex justify-content-center align-items-center">
                                                <div>
                                                    <div class="btn" (click)="IsDeleteData(deleteModal,d)">
                                                        <fa-icon icon="trash" class="text-danger"></fa-icon>
                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                    </ng-template>
                                </p-carousel>
                            </div>

                            

                        </div>
                    </div>

Expected behavior

If carousels are rendering properly in view (html) according to the logic, then for bounded function of each carousel, respective data should get passed, but that is not happening.

[mertsincan]

Hi,

So sorry for the delayed response! Improvements have been made to many components recently, both in terms of performance and enhancement. Therefore, this improvement may have been developed in another issue ticket without realizing it. You can check this in the documentation. If there is no improvement on this, can you reopen the issue so we can include it in our roadmap?
Please don't forget to add your feedback as a comment after reopening the issue. These will be taken into account by us and will contribute to the development of this feature. Thanks a lot for your understanding!

Best Regards,