在Angular 4中单击时滚动到元素

Question

我希望能够在按下按钮时滚动到目标。我在想这样的事情。

<button (click)="scroll(#target)">Button</button>

在我的 component.ts 中，有一个类似的方法。

scroll(element) {
    window.scrollTo(element.yPosition)
}

我知道上面的代码无效，只是为了说明我的想法。我刚刚开始学习 Angular 4，之前没有 Angular 的经验。我一直在寻找类似的东西，但所有示例都在 AngularJs 中，与 Angular 4 有很大不同

原文由 user7136957 发布，翻译遵循 CC BY-SA 4.0 许可协议

Answer 1

你可以这样做：

 <button (click)="scroll(target)">Scroll To Div</button>
<div #target>Your target</div>

然后在您的组件中：

 scroll(el: HTMLElement) {
    el.scrollIntoView();
}

编辑： 我看到评论说由于元素未定义，这不再有效。我在 Angular 7 中创建了一个 StackBlitz 示例，它仍然有效。有人可以提供一个它不起作用的例子吗？

原文由 Frank Modica 发布，翻译遵循 CC BY-SA 4.0 许可协议