Angular: let a singleton service create multiple instances

我們都知道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);
  }
}