angular - (ngx-admin/Nebular) 如何删除我的自定义登录组件上的后退按钮？

Question

我已遵循 https://akveo.github.io/nebular/docs/auth/custom-auth-components#create-auth-module的说明

创建自定义登录组件。

问题是如何从该组件中删除后退按钮？

Answer 1

只需在 component.scss 中尝试这个 css

::ng-deep .navigation .link nb-icon {
  display: none !important;
}

Answer 2

按照您上面提供的说明，在“设置身份验证容器”部分中，您将看到它使用默认的星云身份验证容器组件：

export const routes: Routes = [
  {
    path: '',
    component: NbAuthComponent,  // <---
  },
];

您要做的是创建自己的身份验证容器并根据需要更改模板。作为起点，您可以在此处查看原始 Nebular auth 容器的代码：

https://github.com/akveo/nebular/blob/v2.0.0/src/framework/auth/components/auth.component.ts

您要删除的是以下代码：

<nav class="navigation">
  <a href="#" (click)="back()" class="link" aria-label="Back"><i class="icon nb-arrow-thin-left"></i></a>
</nav>

我希望我说清楚了。如果没有，请随时提出您的疑问，我将提供一个更简洁的示例。

干杯，

Answer 3

感谢 alexandros nikoloulopoulos，我想添加如何隐藏整个卡片标题的方式（将其添加到 component.scss 中）：

    ::ng-deep .nb-theme-default  nb-card-header {
    display: none !important;
    }

Answer 4

您需要打开自定义“NbAuthComponent”组件的模板，并从“nb-card-header”中删除后退按钮。那应该有帮助。

Answer 5

当我将此 css 添加到 src\app@theme\styles\styles.scss 时，后退按钮消失了。

 .navigation .link nb-icon {
    display: none !important;
  }