Angular 2 - 单例服务?
Angular 2 - Singleton Services?
在 Angular 1 中,我经常使用 factories 服务来存储可由许多组件访问的共享状态。看起来在 Angular 2 中,所有作为 @Injectable() 注入的服务每次都被创建,因此失去了共享状态。
我 'register' 根模块的 providers
元键的服务,但我仍然得到一个临时实例。
我有:
Injectable()
export class ArtistService {
constructor(private http:Http) {
// firing on each injection
console.log("ArtistService ctor");
}
}
然后在组件中调用它:
@Component({
selector: 'artist-display',
templateUrl: './artistDisplay.html',
})
export class ArtistDisplay {
constructor(private artistService: ArtistService) {
// instance is fine but transient
}
}
以及模块的定义:
@NgModule({
declarations: [...],
imports: [BrowserModule, FormsModule, HttpModule,
RouterModule.forRoot(rootRouterConfig)],
providers : [
ArtistService,
// make sure you use this for Hash Urls rather than HTML 5 routing
{ provide: LocationStrategy, useClass: HashLocationStrategy },
],
bootstrap: [AppComponent]
})
我怀疑可能有其他方法可以 'register' ArtistService
所以它作为静态实例保持加载?是否可以通过 DI 实现,或者是否需要手动创建静态实例方法?
更新:
事实证明,上面的代码 确实有效 。我正在寻找错误的地方以及导致数据无法正确缓存的逻辑错误。
以上代码有效,并且在 顶级 AppModule 的 providers
部分中分配服务是使父引用在应用组件。它在提供 Singleton 实例的应用程序的生命周期内有效地保持加载状态。
要获得 transient 实例,您可以在实际组件 上声明 providers
元标记和服务名称 然后将在组件为 loaded/re-loaded.
时创建服务
你所展示的是正确的方法。它创建将在组件之间共享的单个实例。
https://plnkr.co/edit/FBCa39YC4ZPoy6y8OZQl?p=preview 供参考。
import { NgModule } from '@angular/core';
import { BrowserModule } from '@angular/platform-browser';
import { AppComponent } from './app.component';
import {service} from './service';
@NgModule({
imports: [ BrowserModule ],
declarations: [ AppComponent],
providers:[service],
bootstrap: [ AppComponent ]
})
export class AppModule { }
我还想创建一个对象作为 angular2 中的提供者使用,所以我创建了一个@injector。
但是如果我们在每个@component 中设置provider 并导入它,那么每个组件使用不同的注入器对象。
为了创建单例提供者,我在父组件中声明了这个提供者并将其导入每个组件,现在它工作正常。 https://angular.io/guide/dependency-injection
好的,让我试着根据我的经验和文档基本上解释服务是如何工作的。
主要有 3 种情况:
该服务包含在组件级别的提供者数组中 - 该服务可以注入父项和所有子项。
该服务包含在模块级别的提供程序数组中 - 此模块中的所有内容都知道该服务。
该服务包含在模块级别的提供程序数组中 - 此模块中的所有内容都知道该服务,但如果您在另一个导入第一个模块的模块中的另一个组件中使用此模块中的组件那么该组件的服务实例将不同。
单例服务只能保存在app.module.ts"providers"(数组)
并且不得放置在任何其他组件或服务提供者(数组)中。
如果正确完成,那么 angular 2 - 2.4.0 - Singleton 完美运行
在 Angular 1 中,我经常使用 factories 服务来存储可由许多组件访问的共享状态。看起来在 Angular 2 中,所有作为 @Injectable() 注入的服务每次都被创建,因此失去了共享状态。
我 'register' 根模块的 providers
元键的服务,但我仍然得到一个临时实例。
我有:
Injectable()
export class ArtistService {
constructor(private http:Http) {
// firing on each injection
console.log("ArtistService ctor");
}
}
然后在组件中调用它:
@Component({
selector: 'artist-display',
templateUrl: './artistDisplay.html',
})
export class ArtistDisplay {
constructor(private artistService: ArtistService) {
// instance is fine but transient
}
}
以及模块的定义:
@NgModule({
declarations: [...],
imports: [BrowserModule, FormsModule, HttpModule,
RouterModule.forRoot(rootRouterConfig)],
providers : [
ArtistService,
// make sure you use this for Hash Urls rather than HTML 5 routing
{ provide: LocationStrategy, useClass: HashLocationStrategy },
],
bootstrap: [AppComponent]
})
我怀疑可能有其他方法可以 'register' ArtistService
所以它作为静态实例保持加载?是否可以通过 DI 实现,或者是否需要手动创建静态实例方法?
更新:
事实证明,上面的代码 确实有效 。我正在寻找错误的地方以及导致数据无法正确缓存的逻辑错误。
以上代码有效,并且在 顶级 AppModule 的 providers
部分中分配服务是使父引用在应用组件。它在提供 Singleton 实例的应用程序的生命周期内有效地保持加载状态。
要获得 transient 实例,您可以在实际组件 上声明 providers
元标记和服务名称 然后将在组件为 loaded/re-loaded.
你所展示的是正确的方法。它创建将在组件之间共享的单个实例。
https://plnkr.co/edit/FBCa39YC4ZPoy6y8OZQl?p=preview 供参考。
import { NgModule } from '@angular/core';
import { BrowserModule } from '@angular/platform-browser';
import { AppComponent } from './app.component';
import {service} from './service';
@NgModule({
imports: [ BrowserModule ],
declarations: [ AppComponent],
providers:[service],
bootstrap: [ AppComponent ]
})
export class AppModule { }
我还想创建一个对象作为 angular2 中的提供者使用,所以我创建了一个@injector。 但是如果我们在每个@component 中设置provider 并导入它,那么每个组件使用不同的注入器对象。 为了创建单例提供者,我在父组件中声明了这个提供者并将其导入每个组件,现在它工作正常。 https://angular.io/guide/dependency-injection
好的,让我试着根据我的经验和文档基本上解释服务是如何工作的。
主要有 3 种情况:
该服务包含在组件级别的提供者数组中 - 该服务可以注入父项和所有子项。
该服务包含在模块级别的提供程序数组中 - 此模块中的所有内容都知道该服务。
该服务包含在模块级别的提供程序数组中 - 此模块中的所有内容都知道该服务,但如果您在另一个导入第一个模块的模块中的另一个组件中使用此模块中的组件那么该组件的服务实例将不同。
单例服务只能保存在app.module.ts"providers"(数组)
并且不得放置在任何其他组件或服务提供者(数组)中。
如果正确完成,那么 angular 2 - 2.4.0 - Singleton 完美运行