I’ve been unsuccessful in making the Bootstrap Carousel plug-in work… although I followed the online example.
The most relevant code (HTML, CSS, .ts) can be accessed at JSFiddle:
https://jsfiddle.net/DaleFrancis/23w0m5k6/4/
JSFiddle doesn’t allow for all of the files and folders necessary to provide a “working demo” of a JavaScript framework (Angular)… but the most relevant code is there to examine. (Don’t try to make something happen in the 4th “results” quadrant.)
Basically there are two problems. First, clearly, the Bootstrap Carousel is not working at all. Why?
A secondary problem, although not trivial, is that most of my images don’t load, returning a “404 (not found)” error. I believe this to be a timing issue where the page loads before the image file (…/src/assets folder) can be resolved. But although I sort of understand the problem I haven’t been able to figure out a solution. (See the NOT WORKING comment in the JSFiddle html quadrant. )
So, two issues, but first it would be good to get a working carousel!
Thank you. If you can contribute you are a very good and smart person.
In terms of your app, I have very little knowledge of Angular, so I am saying this based on React knowledge:
In terms of the carousel, whilst having the buttons (a tags) and data attributes is needed for accessibility, in React, the classes and such still need to be toggled through state management, not HTML. Lastly, the carousel might be missing the role attributes on the a tags, as well as the .carousel-inner element.
In terms of the app on Fiddle, I might suggest something like CodeSandbox, Repl.it, or Glitch, as they are a bit more user-friendly, when it comes to setting up multi-file apps with deps.
If this makes no sense for Angular, then feel free to ignore.
Id recommend using stackblitz to replicate issues within Angular, as it comes out of the box with a template to support it:
Its hard to tell what the issue is since it can be anything and since your missing “the rest of Angular” the app doesn’t work or look as expected so its hard to figure out what is wrong, or could be wrong. Replicating your setup in a simplified environment where Angular is at least working should help
