Question

寻找Angular动画以将div上下滚动到div上，在鼠标移开时我们应该清除滚动。

完全类似的动画。

http://www.solucior.com/13-Scroll_div_with_javascript.html

function scrollDiv(divId, depl) {
   var scroll_container = document.getElementById(divId);
   scroll_container.scrollTop -= depl;
   timer1 = setTimeout('scrollDiv("'+divId+'", '+depl+')', 30);
}

这是Java脚本代码。但是我正在寻找角度代码。

Answer 1

其中一些步骤是非常基本的Angular。如果您证明自己付出了一些努力来找到解决方案，那么我相信社区会很感激的。具体来说，第1部分和第3部分非常基础。我会给您带来疑问的好处，并假设您付出了努力，但仍然感到困惑：-）

您将使用onmouseover=和onmouseout=，而不是(mouseover)=和(mouseout)=，将组件类中的函数放在=之后。进一步了解event binding
代替传递ID，可以在Angular中使用模板引用变量。在要引用的element标签中，添加#someElementName，然后在鼠标事件上调用该函数时，传递someElementName。进一步了解template reference variables
timer1将成为组件（this.timer1 = setTimout...）的类成员。进一步了解component basics

a stackblitz及其结果

使用Angular 4/6动画在Mouseover上滚动div

1 个答案: