在Angular中,有一种方法可以拥有应用程序级别的工具栏,但不能在诸如登录,注册之类的页面中使用它?

问题描述 投票:0回答:1

我是Angular初学者。我正在尝试为我的应用获取效果最好的“登录”页面。我还不想进入Angular Universal。 (请参阅仅有助于减少FCP而不是FMP的地方)。

无论如何,我在应用程序组件中有一个带有ngIf的工具栏。因为它在应用程序组件中,所以我不能延迟加载工具栏相关的JavaScript。因此,尽管该应用程序直到用户登录后才需要工具栏,但它仍会下载必要的JS / CSS / HTML文件。这会使初始页面加载变慢。我研究了可能的解决方案。

  1. 在所有功能模块中添加工具栏(可能是不好的解决方案。)>
  2. 在“ / home”具有一个父组件,该组件仅具有工具栏,并将其余页面作为子组件加载。 (这种方法的问题是我的所有路线中都带有“ home /”。)
  3. 任何其他解决方案将不胜感激。

我是Angular初学者。我正在尝试为我的应用获取效果最好的“登录”页面。我还不想进入Angular Universal。 (请参阅仅有助于减少FCP而不有助于...

angular performance toolbar
1个回答
0
投票

有两种方法可以实现。首先,您可以使用* ngIf,但我不会建议您使用第二个选项,即创建两个模块,一个将是用于登录和注册的auth.module,第二个将是pages.module,它将具有包含工具栏的所有其他组件组件将具有自己的视图页面组件将具有工具栏,而auth组件将具有您要添加的任何内容。从应用程序组件中删除所有内容,并为这些模块添加路由文件

© www.soinside.com 2019 - 2024. All rights reserved.