angularjs - Bootstrap-Tour 与 angularJS

Question

我目前正在做一个项目，我必须在页面上显示游览。

我看了一下 Bootstrap-Tour，结果还不错。我在 angluarJS Controller 工作。所以我创建了一个 Tour，向它添加一些步骤并创建一个按钮，在 AngularJS Controller 中触发 StartTour() 函数:

var t = new Tour({container: "#main",
    backdrop: false,
    debug:true,
    orphan: true
});

t.addStep({
    element: "#content123",
    title: "Title123",
    content: "Content123"
});

t.addSteps(
        [
  {
    element: ".message.message-1", // element selector to show the popover next to;
    title: "Welcome to my tour!",
    content: "We're going to make this quick and useful."
  },
  {
    element: ".message.message-2",
    title: "Let's finish this thing off with a bang.",
    content: "Boom, bang, bam!"
  }
]);
// Initialize method on the Tour class. Get's everything loaded up and ready to go.


$scope.StartTour = function(){
//  t.init();

    t.start(true);
    console.log(t);
    console.log("start!!");
} 

我现在面临的问题是，如果我在创建 New Tour 时不调用 orphan:true，则单击按钮时不会发生任何事情。我该如何解决这个问题？也许一些 Angular 人使用过这个工具？稍后，我想将其打包到指令中。

Answer 1

有一个 AngularJS wrapper现在用于 Bootstrap Tour。

您可以看到现场演示和文档 here .