问题标签 [angular-lazyloading]

尝试根据用户在我的 Angular 应用程序中的角色加载多个模块。

一旦用户被验证并且应用程序收到一条成功消息，这就是我所做的。

我的路线所在的文件（page-routing.module.ts）：

我正在为路径“home”（home-handler.module.ts）加载这个处理程序模块：

正如您在上面的代码中看到的，我正在根据用户角色加载模块。

身份验证服务如下所示：

问题是当具有角色调度程序的用户第一次登录并尝试重定向到主页时。在 home-handler.module.ts configHomeHandlerRoutes() 方法中。authService.getUser() 返回未定义。并始终重定向到 default.module 而不是 dispatcher.module

我还尝试了以下代码从 route.config 中删除当前主路径并重新添加它。但它重定向到 404 找不到页面路径。

AuthService 中的 setUser() 方法：

我该如何解决这个问题或我哪里出错了？

是否可以在两个延迟加载的模块之间共享相同的服务实例，而根注入器未提供该服务？或者至少，在被要求之前不提供？

例如，我有LazyModuleA，LazyModuleB正如命名的那样，懒惰地加载。这些模块中的每一个都需要访问相同的服务，但其他任何地方都不需要该服务。共享服务应该只在模块之间共享一个实例。此外，不应在这两个模块之外加载或访问它。

目前我正在通过根注入器提供服务{providedIn: 'root'}。是否可以为这两个延迟加载的模块加载此服务的相同实例？

我已经在一个角度客户端项目中创建了我的角度元素，比如 A ，现在我想在我的另一个角度 JS 应用程序 B 中加载角度元素构建工件（Dist 文件夹），以便我可以使用在项目 B 中创建的元素。有人可以帮忙吗我如何将 A 应用程序中的工件动态加载到 B 应用程序中，以便 Angular 元素可以在 B 中顺利使用。

我有一个作业模块，其中包含我的应用程序的各种组件。我想对所述模块进行延迟加载，但是，当我尝试通过完整路径访问时它不起作用，也就是说，如果我通过路径访问http://localhost:4200/job/artist它不起作用但如果我通过它访问http://localhost:4200/#/artist它是否有效。知道为什么会这样吗？

延迟加载模块的路由模块

作业路由.module.ts

我有一个角度应用程序，我在其中一个名为“security”的模块中使用延迟加载，我在 app.routing.module.ts 的路由数组中提到过

文件夹结构是

src/应用程序/组件/安全

src/app/components/smotherRoute

源代码/应用程序/组件/...

安全模块有 routing.modules.ts 和 module.ts、component.ts、component.html

src/app/components/security/security.component.ts

src/app/components/security/security.component.html

src/app/components/security/security.module.ts

src/app/components/security/security.routing.ts

在 security.component.html 中

security的路由模块在security.module.ts中导入

security.routing.module.ts 中提到了安全模块的路由

当我尝试通过浏览器访问应用程序安全模块时，它抛出如下错误：

运行时编译器加载失败

或者

加载 chunk1 或 chunk3 失败

但是，这可以使用 npm run serve /ng serve 命令工作，这些错误仅在尝试使用“npm run build:single-spa”时才会出现。（顺便说一句，我正在使用单水疗库。）

我正在用 Angular 材料编写一个 Angular 12 网站。该项目支持多个域，并且在不同的域上它应该显示不同的主题。

所以我在这里要解决的是能够通过延迟加载动态加载主题。

我的自定义主题有效..基本的角度材料功能不起作用，我确实收到了消息

我搜索了很多，如果我正确加载 css 文件并将其附加到头部，它应该可以正常工作。

好的..所以首先..

我创建了应用程序/主题目录

我有 3 个主题，windy.scss、windy-car.scss和windy-shop.scss，每个主题都需要common.scss.

我有几个组件使用我在每个文件中创建的具有特定颜色的变量，common.scss 实际上在选择颜色时装饰组件。

例如：

common.js包括：

并windy.scss包含：

我将展示一个 scss 文件作为示例，当我只使用一个主题时它可以工作，所以我知道格式很好。

这是windy.scss：

现在..在 angular.json 我添加了这些文件inject: false：

我创建了一个 style-manager 服务和一个 theme.service 并将它们添加到app.module.ts.

样式管理器service.ts

和theme.service.ts

我注入并在构造函数private readonly themeService: ThemeService中运行。app.component.tsthis.themeService.setTheme('windy-car');

和结果.. 我确实看到了所选主题的自定义颜色，但是角材料功能被破坏了。color=primary不起作用，并且其他与角度材料相关的样式不显示。

例如，在我拥有的工具栏中color="primary"，颜色仍然是白色。

我确定它与错误有关，Could not find Angular Material core theme. Most Material components may not work as expected. For more info refer to the theming guide: https://material.angular.io/guide/theming但我不知道如何解决这个问题。

有任何想法吗 ？

** 更新 1 **

当我在中添加以下内容时styles.scss：

我仍然得到错误

角度材料组件正常工作，但它完全忽略了我选择的颜色。

我正在尝试延迟加载第三方库，但如果有人有任何想法请分享，我找不到任何解决方案。

我需要将注册模块从角度库延迟加载到我的角度应用程序中。

在这里，您可以在下面看到我正在尝试将“reg_outlet”用于延迟加载的注册模块。但是，这样做，我得到了错误：

错误：无法匹配任何路由。网址段：

register.component.html

注册-routing.module.ts

应用程序路由.module.ts

app.component.html

我有一个模块，其路由定义如下。

我面临的问题是将数据传递到 addNewRole 路径。当我尝试从组件内部访问相同的对象时，它给了我空对象。我做了很多搜索认为这可能是由于这个模块的延迟加载，如下所示

所以为了确认我删除了上面的延迟加载，我可以看到数据通过了。我现在的问题是，我不能在延迟加载的模块内的子路由中定义数据吗？这不是正确的做法吗？有什么建议么？

试图找出问题所在。chrome 更新后，我们在引导程序中遇到了这个绑定问题。在我们的应用程序中，我们实现了延迟加载，它适用于其他应用程序，但在我们的一个 Angular 项目中面临这个问题。

当我将 main-es5.js 更改为 main-es2015.js 时面临同样的问题