1

我们想在我们的 SPA 上使用引导程序游览脚本 ( http://bootstraptour.com )。

由于我们想要浏览多个页面(这是可能的),我将游览放入 中,rootScope并定义了一些函数来开始游览。我的想法rootScope是始终可以在应用程序中使用,因此始终可以访问游览。

显示了第一步,但是当我想更进一步时,重定向后游览会停止。所以用户在下一页但没有游览......

由于我们在游览中使用角度转换,我们不能将游览放在单独的文件中以加载外部角度。

这是一个旅游的代码,(我们有 4 个不同的旅游)放在rootScope. 为了可读性,我删除了一些步骤。

所以在这段代码中,游览在第 3 步之后停止,但它从第 4 步开始转发到路径

var generalTour = new Tour({
        debug: true,
        name: "GeneralTour",
        storage: window.localStorage,
        steps: [
            { //1
                element: '#generalTourHome',
                title: $filter('translate')('START_WITH_PRISMANOTE'),
                content: $filter('translate')('GENERALTOUR_WELCOME'),
                path: '/retailer/home'
            },
            { //2
                element: '#generalTourMyShopMenu',
                title: $filter('translate')('MORE_SHOPS'),
                content: $filter('translate')('HERE_YOU_WILL_FIND_YOUR_SHOPS'),
                path: '/retailer/home'
            },
            { //3
                element: '#generalTourMyShopIcon',
                title: $filter('translate')('SHOP_DATA'),
                content: $filter('translate')('CLICK_ON_SHOP_ICON'),
                path: '/retailer/home'
            },
            { //4
                element: '#generalTourFillInInformation',
                title: $filter('translate')('FILL_IN_DATA'),
                content: $filter('translate')('FILL_IN_YOUR_DATA'),                 
                path: '/retailer/shop'
            },
            { //5
                element: '#generalTourBrands',
                title: $filter('translate')('SHOP_BRANDS'),
                content: $filter('translate')('INDICATE_WHICH_BRANDS_YOU_ARE_USING'),   
                path: '/retailer/shop'              
        },
        ]
    });

$rootScope.startGeneralTour = function(){
    generalTour.init();
    generalTour.start(true);
    generalTour.restart();
}
4

1 回答 1

0

您似乎正在两个页面上开始并重新开始巡回赛。您应该在/retailer/shop页面上设置条件,如果需要继续游览,请不要重新启动它:

$rootScope.startGeneralTour = function(){

    generalTour.init();

    if( some_function__is_page( '/retailer/shop' ) && !generalTour.ended() ){
        generalTour.start(true);
    } else {
        generalTour.restart();
    }
}

/retailer/shop如果您还想在页面上继续游览,则可以跳过检查您是否在该条件下的/retailer/home页面上,以防用户实际上没有结束游览但例如他刷新了页面。

于 2018-08-14T10:48:39.497 回答