Calling specific parts of a list thats being rendered

[macangular]

Is there a way to target specific parts of a list that is getting loaded from typescript. For example, making a list of field names in typescript and on the html just looping through the form and getting the different fields to show but with joyride i wanna say target just the first name field then another one rather then the whole div thats rendering it.

[tnicola]

Hi @macangular ! I'd be glad to help you but I'm not sure to have understood your point here. Do you need to target only the text, without the entire div background? If you need to loop for all your fieldsyou can with the joyride. Can you give me an example?

[macangular]

Hi @tnicola after trying to debug for 4 days i eventually realized i can can make an array and go through it and while going through it set it to the ngx-joyride and now it can iterate through a dynamic list.

However, I do have 1 question. Is it possible for the joyride to scroll down a page while giving a tour? because im having trouble with the joyride only showing a tour on whats on the page without scrolling.

[macangular]

Also, is there a way to add more left-padding to the white tour box because its really close to the text?

[tnicola]

Do you think that documentation should be improved?

The joyride should scroll automatically to the target every time you move to the next step. Doesn't it scroll for you?

For the padding and the styles more in general you can override the css of the library. e.g:

.joyride-step__container {
     padding: 20px;
}

[macangular]

I think the documentation is good but can be improved so that some people would know that ngx-joyride can be used in a dynamic list situation.

Also, no the joyride doesn't automatically scroll. Whatever is showing on the page (without scrolling) works perfectly by showing you all the steps and moving to them but when it reaches the bottom and needs to scroll it just doesn't scroll but the joyride i'm assuming is still working because the joyride didn't crash and was letting me go to the next step just couldn't see where its highlighting over.

Thank you for the padding overriding i'll give that a try.

[ghost]

auto-scroll doesn't work on my project either (I'm using Angular7 if this info helps). My target is way down the page so when the page loads I can only see the backdrop.

[tnicola]

Sorry about the delay!I'll find out why auto-scrolling doesn't work.

[sublimator]

Neat lib @tnicola! Also seeing some auto scrolling issues, and also using angular v7

[tnicola]

Guys, I've tried with Angular 7, auto-scrolling works fine for me. Can you add more details on your issue?
Browser, Browser version, other libraries you're using, is it the first/last step in your tour? Can you reproduce it on stackblitz? I'll continue the investigation in the meanwhile.

[sublimator]

Hey, will try and get u some info soon (afk atm). It was sth I was only barely aware of. Thanks (again? implied?) the cool lib! :)

[macangular]

Hi, the way i was doing it that i was having the joyride not scroll was having the header and footer static and the body in the middle has a list that is getting the information for the list from the typescript side. The body i believe also had its own independent scrolling rather than the window scrolling.

[tnicola]

Hi all,
Sorry for the delay, I sorted out what was the problem, I was taking in account only the window scroll. Now the auto-scroll should work on all the scrollable items. Try it out in the new version 2.2.2
Thanks for the feedbacks!

[sublimator]

Tnicola, hey, thanks! Sorry never got around to sending a report

[macangular]

Hi Tnicola,
Thank you for the response back and fixing the issue. I'll go ahead and try it out.