ui-carousel | Angular carousel Component | Carousel library

How can I configure my number of pages per carousel to have a limit of noOfPages? I'm not sure how to implement this in my functions below.

Hi i've found this https://github.com/Learus/react-material-ui-carousel to use it on my website. But i've encountered 2 problems:

1. In order to set the autoPlay state, i have to change it to class which leads to unable to use const classes = useStyles() so does anyone know what should i do?

2. I have 3 jpg photos saved in the img folder under the same directory and i have no idea why the photos cant be loaded in my localhost.

Here is my code:

I'm trying to get my build much smaller to get my load time faster, but when I run

ng build --prod --aot --vendor-chunk --common-chunk --build-optimizer and then run a lighthouse report from google dev tools

I get

what's odd is that it seems to have worked if I go into the dist folder to look at file sizes, which seem smaller that the lighthouse report.

So far to reduce the size by doing the following:

• Removed old/unused package.json entries
• changed all material imports to specific path like for paginator I'm importing now as import { MatPaginator } from "@angular/material/paginator"; instead of import { MatPaginator } from "@angular/material/"; per the advice from other posts.
• replaced moment with moment.min.js so that locales don't get added
• added brotli for text compression.

Also I want to mention because I don't know if it's relevant, but I don't have a webpack.config.js file only a custom-webpack.config.js for brotli. The only thing I edited in angular.json to get webpack working was this for brotli

I'm following this tutorial and I'm trying to get brotli working with angular projectI created a ```custom-webpack.config.js file and put in the root directory where angular.json is located. (also tried src folder, but that didn't work) As soon as I update the angular.json file to

I would like to use PrimeNG's Carousel component and customize it. How do I implement it into my HTML code?

I have followed some of the advice through Stackoverflow and other websites to help declare the styleclasses thanks to :host >>> .ui-carousel on the CSS file. However, I couldn't find a way to use properly on my HTML file.

CSS code

im very new to Angular and i started a test Project with Angular Cli. All works fine but i have installed a 3.rd Party Module (angular-ui-carousel). Now i get following error:

Hey guys so im struggling to figure out how to add custom styles to elements for different pages If i add the styles to the global css it works. For example i use ui-carousel on three different pages and i need them to look different on each, so global wont work for me in this case If i put a div class in my indiviudal css pages it works fine as i can name the class.

I am using UI Carousel, but facing difficulty in accessing parent scope inside it. Below is the demo code for the same.

I'm looking for an AngularJS carousel module that can mimic exactly the visual format of this picture:

I tried using https://mihnsen.github.io/ui-carousel/ but got errors: https://github.com/mihnsen/ui-carousel/issues/35

I just need something that works well in AngularJS and visually mimics the picture. Any suggestions?