AngularJS ui-router，滚动到状态更改的下一步

我在我的应用程序中使用 UI-router，当 URL/状态更改时，我想使用一个简单的“scrollTo”到锚点。我不想从模板加载下一步，或加载新的控制器。我只是希望页面上已经有几个 div 并在它们之间上下滚动。 HTML 的简化视图如下所示。

    <div id="step1">
        <button ng-click="moveToStep2()">Continue</button>
    </div>
    <div id="step2">
        <button ng-click="moveToStep3()">Continue</button>
    </div>
    <div id="step3">
        Step 3 content
    </div>

因此，当您进入该页面时，URL 将是域名.com/booking

当您单击第一个按钮时，我希望我的控制器代码将 URL 更改为域名.com/#/step-2并向下滚动到“step2”div。

理想情况下，当用户点击后退按钮时，它将恢复到第一个 URL 并向上滚动回到步骤 1。

有人知道该怎么做吗？

第一的。您需要定义状态。

.state('step1', {
    url: '/step-1'
})

Add onEnter控制器（这样你就可以$inject事物）。

.state('step1', {
    url: '/step-1',
    onEnter: function () {}
})

动画（或简单地滚动）到元素

$('html, body').animate({
    scrollTop: $("#step1").offset().top
}, 2000);

Here http://jsfiddle.net/umidbek_karimov/LRyKB/这个例子