Angular 2延迟加载模块-服务不是单例

2024-06-07

我已经在我的应用程序中实现了延迟加载模块,app.module.ts 配置正确。

@NgModule({
  declarations: [
    AppComponent,
    HeaderComponent,
    HomeComponent
  ],
  imports: [
    BrowserModule,
    FormsModule,
    HttpModule,
    routing
  ],
  bootstrap: [AppComponent]
})
export class AppModule { }

路由配置

const APP_ROUTES: Routes = [
  { path: '', component: HomeComponent },
  { path: 'tools', loadChildren: 'app/tools/tools.module#ToolsModule' }
];

export const routing = RouterModule.forRoot(APP_ROUTES);

通过子模块中的providers字段提供服务并在该模块的组件之间切换会重新实例化该服务(通过登录服务构造函数进行测试)。

该服务仅在模块中提供。

@NgModule({
  declarations: [
    ToolsComponent,
    ToolsCartComponent,
    ToolsContainerComponent,
    ToolsFormComponent
  ],
  imports: [
    CommonModule,
    toolsRouting
  ],
  providers: [ToolsService]
})
export class ToolsModule { }

为什么提供的服务不是单例?

EDIT:

我通过添加仅适用于该模块(在本例中为后端模块)范围内的服务,修改了延迟加载模块的 plunker 示例。在 BackendComponent 和 BackendSecondComponent(均在延迟加载模块下声明)之间切换,服务将被重新实例化(在控制台中可见)

笨蛋链接 https://embed.plnkr.co/Y4r1CfZ6VmGHQ1W5hLGu/


我相信这是一个已知问题,已在此处跟踪https://github.com/angular/angular/issues/12869 https://github.com/angular/angular/issues/12869.

本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

Angular 2延迟加载模块-服务不是单例 的相关文章

  • 无法加载资源:服务器在已部署的 React.js 项目中响应状态为 404(未找到)

    当我将 React 项目部署到 Surge 中时 构建成功并且可以获取应用程序 URL 但是当我链接到 URL 时 我可以在检查控制台中看到一个空白页面和一些错误 Failed to load resource the server res
  • EXT JS中有全局变量吗

    在 java 和 C 中 我们可以全局存储变量并从项目中的任何位置访问它的值 比如说 我在一个名为Residence我正在保存residenceNumber这是一个INT到一个名为的全局变量houseNumberGlobalVariable
  • Angular4 中的打印功能 - 未显示反应式表单值

    我在 Angular4 中使用反应式形式 我想实现同样的打印功能 但是 打印时不会显示反应形式值 我怎样才能实现这个目标 下面发布我的代码 html section section
  • 切换 Ag-Grid 中的浮动过滤器?

    我试图通过开关或按钮单击来确定浮动过滤器的显示 看起来很简单 我应该能够在 true 和 false 之间切换 将该值提供给网格选项中的浮动过滤器 然后刷新标题 对吗 不幸的是 网格似乎总是落后一步 当我第一次点击时 什么也没有发生 当我将
  • 将 Babel 与单个输出文件和 ES6 模块一起使用

    这是我的 gulp 任务 将 ES6 代码编译成单个 ES5 文件 我使用类和模块 import export 在 ES6 中 gulp src paths scripts pipe sourcemaps init pipe babel p
  • 递归process.nextTick警告

    作为我的应用程序的一部分 我有以下代码行 process nextTick function pre populate cache with all users console log scanning users table in ord
  • 闭包和异步 Node.js 函数

    All 尝试了解 Node js 上下文中的闭包 异步调用 我有以下代码 timer setInterval pollOID 1000 function pollOID for channel in channels session get
  • 如何在反应路由器的登录页面中隐藏导航栏

    我想隐藏登录页面中的导航栏 我确实做到了 但我在其他页面上看不到导航栏 此代码是 My App jsx 文件的一部分 我在 App 的状态中创造了历史 当路径名是 或 login 时 我会隐藏导航栏 有用 但随后我输入了 ID 和密码 然后
  • 多个模板槽的相同槽内容

    在vuejs中 有没有一种方法可以为多个插槽设置相同的内容 而无需复制粘贴 So this
  • Firebase 停止监听 onAuthStateChanged

    从版本 3 0 0 开始 我很难删除身份验证状态更改侦听器 要根据文档启动侦听器 firebase auth onAuthStateChanged function user handle it 但是 我在文档中找不到任何涉及删除身份验证状
  • ngClass 中的多个条件 - Angular 4

    如何对 ngClass 使用多个条件 例子 section 像这样的东西 我的 2 个菜单有相同的类 当其中一个菜单为真且 某事 为真时 我需要类 希望我解释得足够好 您正在尝试将数组分配给 ngClass 但数组元素的语法是错误的 因为您
  • 如何在从数据库异步加载中用占位符替换不存在的图像

    我有一个包含图像的数据库 我需要根据用户的请求即时加载这些图像 这些图像将作为包含 div 容器中的单独 s 的背景图像 类似于图像滚动条 该数据库当前是本地数据库 但这不是我的问题 问题是数据库可能没有我请求的所有图像 并且我可能会得到一
  • 使用 _.extend() 进行 JavaScript 继承

    有什么区别 Employee prototype Object create Person prototype and extend Employee prototype Person prototype 两者都给出相似的结果 输出 但下划
  • Firefox 本地主机上的 Twilio 屏幕共享?

    目前 Firefox 中本地主机上的屏幕共享会引发以下错误 The request is not allowed by the user agent or the platform in the current context 这是我的代码
  • 删除移动设备上的 adsense

    我正在研究响应式设计 但在使用 adsense 时遇到了问题 我有一个广告应该显示在桌面设计上 但不能显示在移动设计上 因此 只有在桌面上查看网站时 才应将广告代码放置在 html 中 css 可以使用 display none 但这违反了
  • 未捕获的类型错误:无法分配给只读属性

    我正在尝试 Nicholas Zakas 所著的 Professional JavaScript for Web Developers 一书中的这个非常简单的示例 但我不知道我在这里做错了什么 我错过了一些非常简单的事情 但我被困住了 这是
  • 如何捕获 google 地图的无效 API 密钥

    我有这个代码 如果密钥无效 则会弹出警报 但我想在这种情况下执行一些操作 但我不知道如何连接它 有任何想法吗 Google 不提供检查 Google 地图 API 密钥的外部方法 因此 您无法使用例如查询某些服务 此代码有效吗abcde12
  • 在特定路线中添加类 - Angular 2

    当我在某条路线上时 我正在尝试添加课程 代码在我的 AppComponent 中 我使用 ngClass Component selector my app template a Some html code 然后我在同一个 app com
  • 如何防止外部 CSS 添加和覆盖 ReactJS 组件样式

    我有一个自定义的 ReactJS 组件 我想以某种方式设置样式 并将其作为插件提供给许多不同的网站 但是 当网站使用全局样式 Twitter bootstrap 或其他 css 框架 时 它会添加并覆盖我的组件的样式 例如 全局 css l
  • 如何将 JSLint 用于依赖于 JQuery 的代码段?

    我对 Javascript 比较陌生 我想通过 JSLint 运行我周末玩的那段代码 这样它就可以指出我在哪里是个十足的白痴 不幸的是 我收到了大量关于缺少函数声明的错误 这些函数声明是 JQuery javascript 库及其各种插件的

随机推荐