How to create multiple tours?

[AksanaMaliaus]

Hi. I need to create multiple tours in my application. Is it possible to do?
I've already tried, but had unexpected behaviour and errors.

[hakimio]

You can have one tour at a time. After one finishes you can reconfigure the tour with different steps.

[AksanaMaliaus]

So which way is preferable:

1. I create one tour at the root of the project and assign different steps depending on the condition.
2. I create two tours in different Angular components, assign steps to each of them and launch one by one.

And should I explicitly end the previously launched tour with end() method? Or it will be done implicitly if user click on "end" button or "cross" sign?

[hakimio]

Option number 2. The tour service is global to the whole app, you can not have 2 tours configured with different steps at the same time.
You can launch a new tour after the previous one is completed by the user or you explicitly complete it by calling the method. Might be best to simple check the state of the tour with getState() before starting the second tour to make sure you are not starting a new tour while the previous one hasn't ended yet.

[AksanaMaliaus]

Thank you very much, it works now! But instead of getState() I used end() for current tour before initialization a new one, because there is no getState method in the API.

[hakimio]

Sorry, it's called getStatus(). See the following example:

ngx-ui-tour/projects/lazy-tour-demo/src/app/components/home/home.component.ts

Line 19 in 26b33ed

if (this.tourService.getStatus() !== TourState.ON)