问题标签 [angular-lazyloading]

我在 Angular 9 中的路由有问题。这是应用程序路由模块：

这里来自 HomeModule 的 home 路由是惰性加载的：

来自 UserManagementModule 的用户管理路由延迟加载。

最后是 TenantManagementModule 的路由（延迟加载也是如此）。

问题是当用户输入基本 url (spa/) 时，它应该重定向到 spa/dashboard，而不是重定向到 spa/ 并显示 TenantUpdateComponent，因为它具有空路径。但是，如果您在路线“spa/tenant_management”中，则应该只评估空路径，但如果您在基本路线“/spa”中，则不需要评估。它应该重定向到仪表板，这就是我在主路由中定义此路由的原因：

此外，您可以访问路线“spa/list”，但它不应该存在该路线。如果您输入“spa/user_management/list”，它应该可以工作，否则我想将用户重定向到仪表板。

提前致谢。

Angular 的一些代码结构问题。我正在尝试实现分屏设计，其中左右显示不同的数据，基于不同的查询。左侧通常会指示右侧显示哪些数据。

例如：左边将有一个艺术家列表。单击艺术家时，他们的专辑列表将出现在右侧。一种有效但感觉不太正确的方法如下：

可以访问 URL 参数的“screen one”组件。在这个组件/模块中，我们导入 Artists 组件和 Projects 组件。屏幕一个组件处理对 Firestore 的查询并将它们传递给这些组件：

这工作得很好。但是，这将出现在 route 上/artists。当点击艺术家时，路线将是/artists/:artistID。这里棘手的部分是，在我的路由模块中，我现在有两条路由加载完全相同的模块。这是一个问题吗？路由

我有一个图片库，我打算在滚动时慢慢加载图片。

为此，我执行了一个发送图像路径的函数，然后我在 base64 中接收图像。

我试图在 stackblitz 中进行模拟，但我看不到图像，并且正在执行该函数。

图像没有出现的原因是什么，来自函数的返回？

有人能帮我吗？

使用的库：ng-lazyload-image

演示

HTML

功能

问题 --> 图像不出现

我打算图像由函数返回，而不是直接从图像对象的 * ngfor 中返回。

我正在构建一个应用程序，我在应用程序开始时对用户进行身份验证。根据用户是否已通过身份验证，我想延迟加载不同的角度模块。

在上下文中：

app.component.ts

这是我启动身份验证逻辑的地方，该逻辑在不确定的时间点完成。如果需要，我可以在完成 Observable 后选择加入。

身份验证完成后，我将路由器插座加载到 ​​DOM。

应用程序路由.module.ts

这些是我的顶级路线。现在，我想要实现的是当用户通过身份验证时，延迟加载SecretModule并显示其内容。

另一方面，当身份验证失败时，我想将用户导航到主页并延迟加载HomeModule.

现在我看到一个关于SecretModule. 我能想到的一种解决方法是在身份验证完成后在其他地方手动实现这个条件路由逻辑，而不是“角度方式”。

您认为这里实现上述逻辑的最佳方法可能是什么？

（顺便说一下，我正在使用 Angular 11）

我创建了一些使用其他组件的组件。除了我创建的最后一个组件外，所有组件都可以正常工作。这是 HTML 中的代码：

这是我的新组件的模块：

在进口中有ComponentsModule包含WindowComponent：

在最后一个组件控制台中，在构建时向我显示此错误：

添加NO_ERRORS_SCHEMA和CUSTOM_ELEMENTS_SCHEMA完全没用。Angular 模块有什么问题？

我正在编写一个带有本地化的 Angular 11 通用应用程序。

我想要实现的是能够scss根据选择的语言环境加载更多文件。

因此，例如，如果用户选择Hebrew它将添加styles-he.scss添加的direction:rtl.

我用谷歌搜索了很多，基本上都说和这个网址一样：https ://juristr.com/blog/2019/08/dynamically-load-css-angular-cli/

我需要在 angular.json 中添加新样式，以便延迟加载：

然后我应该在以下位置创建一个 loadStyle 组件app.component.ts：

并随时loadStyle('styles-he.scss')执行

啊..实际上教程谈到了css，不知道是否scss可行。可能我必须在这种方法中使用 css。

问题是我希望有一种更角度的方式来包含这些基于国家/地区的样式文件。当我执行这个函数时不太明白，我怎么知道它是哪种语言。

这是我的语言环境配置angular.json

所以总的来说，我迷失了根据所选语言环境添加更多样式的正确方法。

我使用带有路由的延迟加载模块进行一级导航。每个第一级导航元素一个模块。这工作正常。

我使用延迟加载动态加载子导航（二级）项目。原则上路由是有效的，但是一旦用户为第二级元素的路由添加书签，应用程序就找不到正确的路由。

对此有什么想法吗？

懒惰的模块正在急切地加载，没有为懒惰的模块创建单独的块

我创建了一个 repo 来重现这个问题

1.克隆https://github.com/sameerthekhans/lazy-load-angular-webpack-temp.git

2.npm i

3.npm start

4.Output - 没有创建块文件dist并且模块被急切地加载到浏览器中

附加信息
我使用了所有最新版本的依赖项Angular - 11.1.1，Webpack - 5等等...
*另请注意，我没有使用angular-router-loader@ ngtools/webpack。

我有两个内置在node_modules目录中的库。我在两个库中使用libray1inlibrary2并同时使用 inapp-routing.module.ts来延迟加载路由。当我构建主应用程序时，它仅显示library2在延迟块文件下。

这是app-routing.module.ts

我不明白为什么会这样。我怀疑这可能是由导入library1模块引起的，library2但我检查并构建结果没有改变。任何人都可以指出我为什么会发生这种情况的正确方向？

我正在做一个 Angular 项目。我得到了一个带有捆绑 css 和 js 文件的 HTML 模板。

首先，我将它们放在angular.json中并进行正常路由（直接从 app.routing.ts 路由每个组件）。这种方法效果很好。加载了外部的js和css。

我在 angular.js 中的构建选项，

我的 app.routing.ts，

但是在我将项目结构更改为延迟加载之后。bundle css 文件正常加载。但是没有加载JS文件。似乎 bundle js 文件中的每个函数都没有被触发（但浏览器的控制台仍然显示它是在 webpack 中加载的）。

下面是我真正使用的 app.routing.ts

下面是我的 layout-routing.module.ts，

webpack 显示它已加载，

我想念什么吗？我已经尝试将该 js 文件放在资产中并从 index.html 中调用它。这种方法还是不行。请帮忙。