html5 – 在Ember.js中使用HTML锚点

在我的Ember应用程序中,如何跳转到我的Handlebars模板中的 HTML锚点？ I created a jsFiddle that shows what I want to accomplish.

背景
Ember通过应用程序导航的模型使用HTML锚点.

我有以下要求：当用户点击Handlebar linkTo助手导航到新的路线目的地时,浏览器应自动滚动到与该新路线目的地相关联的Handlebars模板内的锚点.

解决方法

使用jquery滚动到特定部分.

$('html,body').animate({
    scrollTop: $("a[name='someAnchor']").offset().top
});

关于相同,请参阅this SO answer.

在渲染视图后滚动到锚点会覆盖路径视图定义中的didInsertElement.

关于相同,请参阅this SO answer.

App.LonglistView = Ember.View.extend({
    didInsertElement: function() {
        // Place the scroll to anchor code here.
        $('html,body').animate({
            scrollTop: $("a[name='someAnchor']").offset().top
        });
     }
});

这里是jsfiddle中的a working example(为了清楚起见,我没有添加任何数据模型)

编辑：您也可以使用非jquery方式进行滚动

document.getElementsByTagName('a')[name='someAnchor'].scrollIntoView()

jsfiddle example为同样的.