问题标签 [sidenav]

我正在尝试实现一个侧边栏，在整个应用程序中单击各种按钮时打开（“更多信息”类型的功能）。出于这个原因，我希望将侧边栏组件放置在路由器插座之外。

应用组件：

当侧边栏打开时，我想将屏幕的其余部分变灰并在任意位置单击（在侧边栏旁边关闭侧边栏）。我想这样做的方法是将导航和路由器出口包装在一个带有单击事件的 div 中以关闭侧边栏。侧边栏打开/关闭/切换由服务管理。我遇到的问题是像这样包装路由器插座（和导航）会覆盖用于打开侧边栏的路由内的实际按钮单击。有什么建议吗？非常感谢

我正在尝试构建一个类似于phonecat 应用程序但略有不同的应用程序。而不是以两种方式排序的下拉菜单-（1）按字母顺序和（2）最新，而在我的应用程序中，我有不同的类别/品牌。而且我正在尝试通过 json 数据显示每个类别，但这并没有发生。

假设有联想、诺基亚、三星和 LG 4 个品牌。我有一个 json 文件手机，其中包含这 4 个品牌，每个品牌都有不同的手机型号作为 json 文件，其中包含产品链接和图片网址等详细信息。现在我在左边有一个导航栏，上面有这 4 个品牌。单击每个品牌时，仅应显示与该特定品牌相关的电话。使用下拉菜单效果很好，但我需要在导航栏中使用它。

当前工作代码：

我不明白代码中写了什么(isHandset$ | async)请解释

当我向下滚动时，如何修复我的sidenav身体滚动时我的sidenav底部变空了

当我单击带有 javascript 的链接时，如何防止侧边导航返回？在侧面导航中，我有三个链接，一些页面链接到其他页面。因此，每当我打开导航并单击链接时，侧面导航就会关闭。我怎样才能让它浏览页面但仍然保持侧面导航打开？mu javascript代码是：

通常我在 javascript 中使用 add 类，它只用于打开！我知道这可能是一个愚蠢的问题，但我是 Javascript 的新手，提前感谢你帮助我

我创建了侧面导航栏，我想在恢复浏览器的高度时，根本看不到滚动条。

这是我的 CSS 代码：

As the title says. I tried using the Overlay item that comes with blueprint, but that had the issue of only being able to scroll within the overlay. Also tried using reflexbox but that had the issue of not being able to scroll individually within the sidenav vs main content. I'm looking for something like

a | a a a

a | a a a

a | a a a

where the sidebar and the maincontent can scroll independently

https://codepen.io/jayllopy/pen/bQgRPY

我有这个链接将所有背景更改为白色不透明度0.4，除了#main，bg颜色为红色

问：我想在 sidenav 打开时将#main 背景更改为 rgba(0,0,0,0.4)

我在左侧有一个sidenav，它有多个菜单。如果菜单单击预览 sidenav 旁边的另一个 sidenav 打开。Angular 材质仅在左右位置有 sidenav。添加额外的sidenavs是正确的

示例链接https://stackblitz.com/edit/angular-mhmxv6?embed=1&file=src/app/app.component.html

我设法用 Angular Material 做到了这一点，它与使用下拉菜单部署的子菜单一起工作，但我正在寻找一种方法使它们不是“下拉菜单”，我正在寻找它们就像一种向右的过渡，像这样：

https://jmouriz.github.io/angular-material-multilevel-menu/demo/demo.html#!/demo/views/item-2

但是这个是在 AngularJS 1.X 中完成的。我正在使用 Angular 5，有没有人想出任何方法或从哪里开始？谢谢！