【问题标题】:Why is a singleton service instantiated on every route change and not only once in Angular 6?为什么在每次路由更改时都会实例化一个单例服务,而不仅仅是在 Angular 6 中实例化一次?
【发布时间】:2019-07-02 03:51:53
【问题描述】:

我有一个这样定义的服务:

import { Injectable } from '@angular/core';
import { HttpClient } from '@angular/common/http';
import { Observable, of, Subscription, combineLatest } from 'rxjs';
import { map, catchError, retry } from 'rxjs/operators';

@Injectable({
  providedIn: 'root',
})

export class MyDataService {
  constructor(private http: HttpClient) {
    console.log('Called MyDataService constructor');
  }
}

据我了解,该服务在整个应用程序运行时应该是单例的。

现在,当页面刷新时,它会正确记录“调用的 DataService 构造函数”。

不幸的是,当我导航到另一个页面(带有延迟加载模块的新路由)时,构造函数再次运行,并在每次路由更改时记录“调用的 DataService 构造函数”。

我错过了什么吗?

【问题讨论】:

  • 您是否在任何其他组件或模块中注册了服务(在providers 数组中定义)?
  • 它应该(或可以)是单例。这取决于您提供服务的方式。如果当前不是,您应该查看您的模块和导入,并确保您的服务也有一个 providedInRoot: true 集。
  • @DeborahK 也非常感谢。它仍然在另一个组件中提供。现在它按预期工作。也许这对将来的其他人有帮助,因为它可能是一个陷阱。 :)

标签: javascript angular angular6 angular-services


【解决方案1】:

providedIn: 'root' 表示它只会被实例化一次,并且会为所有依赖请求提供相同的实例。如果您看到构造函数多次运行,那么您将在其他地方提供它。按照providedIn 搜索您提供它的位置:“root”不需要列在提供列表中。搜索“provides : [”并查看提供 MyDataService 的内容并将其删除。如果您使用的是 VS Code,您可以右键单击类名并选择查找所有引用并查看它在提供数组中的位置。

【讨论】:

  • 要添加到这个答案...您可以在此处的文档中找到有关单身人士的更多信息:angular.io/guide/singleton-services
  • 非常感谢。这就是问题所在。它也意外地在另一个组件中提供。我希望这对其他人也有帮助。
猜你喜欢
  • 1970-01-01
  • 2021-06-29
  • 1970-01-01
  • 2012-08-30
  • 2014-02-08
  • 2020-11-17
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
相关资源
最近更新 更多