我們都知道Angular Service是Singleton Pattern,但是不幸的事... 我們有時會因為一些需求,希望能夠在多個元件中不要共用同一個Instance,而是在多個元件中使用不同的Instance。 事實上這個問題並不難,其實只需要短短幾行程式碼就可以解決,我們只要使用useClass並配合@Inject去注入Service就可以得到不同的Instance,其範例如下所示。 1. 首先,我們在providers它建立了兩個provider分別是Instance_1和Instance_2。 2. 接著在constructor使用@Inject去注入那兩個provider。 3. 最後你會發現Instance_1和Instance_2會是不同的Instance。 @Component({ selector: 'app-root', providers: [ { provide: 'Instance_1', useClass: StorageService }, { provide: 'Instance_2', useClass: StorageService } ], templateUrl: './app.component.html', styleUrls: ['./app.component.css'] }) export class AppComponent { constructor( @Inject('Instance_1') private Instance_1: StorageService, @Inject('Instance_2') private Instance_2: StorageService) { console.log(this.Instance_1 === this.Instance_2); } }