角度2滚动行为答案

【问题标题】：angular 2 scrollto behaviour角度2滚动行为
【发布时间】：2016-07-14 16:35:45
【问题描述】：

我跟着angular 2教程：路由和导航-查询参数https://angular.io/docs/ts/latest/guide/router.html#!#query-parameters

这个想法是从一个列表向下钻取到一个新的路由，然后返回到列表中的相同项目。

这对他们来说很好，因为列表很短，没有滚动。

我有同样的情况，但清单很长。返回列表屏幕后，我加载并绑定列表，我需要将滚动设置为当前项目（并不总是可见）。我试过了：

 ngAfterViewChecked() {
        if(this.selectedId)
            this.el.nativeElement.querySelector("[id='7']").scrollIntoView();
    }

（为简单起见，对 7 进行了硬编码）实际上是在每个钩子上尝试过，每次查询选择器返回 null 时。（在页面加载后的浏览器控制台上，这一行工作正常：...querySelector("[id='7']").scrollIntoView();)

我没办法了，你能想出其他东西来完成绑定列表后的滚动吗？

这里是 Angular 的实时示例：http://plnkr.co/edit/?p=preview 如果您缩小窗口（以获取滚动条）并单击最后一个英雄（rubberMan），您会明白我的意思。谢谢

【问题讨论】：

标签： angular angular2-routing

【解决方案1】：

我找到了解决方案/解决方法：

ngAfterViewChecked() {
    let timer = Observable.timer(0);
    timer.subscribe(t => {
        if (this.selectedId)
            this.el.nativeElement.querySelector("[id='" + this.selectedId + "']").scrollIntoView();
    });

零延迟的计时器可以解决问题

【讨论】：