Question

我在目标网页中有多个部分（每个部分都采用全屏）。我想用1.箭头键（向下箭头）和2.鼠标滚动将用户带到下一部分。有什么办法可以在Angular中轻松完成吗？无法实现基于jQuery的代码......谢谢！

注意：所有三个部分共享相同的网址

Answer 1

您可以使用$document.bind绑定到键盘事件，如下所示：

function handler(event) {
  console.debug(event)
};

// or bind/unbind instead of on/off
// if using just jqLite 
$document.on("keypress", handler);

//to deregister handler
$document.off("keypress", handler);

由于您希望使用相同的网址，因此最好使用Angular UI路由器和nested views。请注意，您可以将同一个控制器与嵌套视图一起使用，也可以选择为每个视图提供单独的控制器。如果您想介绍使用单独控制器的复杂性，您可以使用一个便于导航的父控制器（例如，用于“视图”状态）并使用$ rootScope。$ broadcast与子视图进行通信（例如“view.child1”，“ view.child2“等等。）（虽然我更喜欢像postal.js这样的更明确的机制 - more on using postal with angular here）$state.go可能是你想在这种情况下用来导航的方法在嵌套视图之间。

使用Angular中的箭头键轻松滚动到下一部分的简单方法/插件

1 个答案: