title: Angular dependency injection, services lifetime
body: <p>Having some questions regarding the lifetime of Angular services. My current understanding is that if you inject the service into a component, and the service is provided in the providers array of that component, then the service will be destroyed when the component is destroyed. </p>
  
  <p>Here is an example to be less abstract:</p>
  
  <pre><code>@Component({
    selector: 'app-offline-header',
    templateUrl: './offline-header.component.html',
    styleUrls: ['./offline-header.component.css'],
    providers: [WebsocketService]
  })
  
  export class OfflineHeaderComponent{ 
    constructor(private socket: WebsocketService) {}
  }
  </code></pre>
  
  <p>In the above example the <code>WebsocketService</code> is injected on the level of this component and not on the app.module (or other module). So if this component is destroyed the service instance will also be destroyed?</p>
  
  <p>Questions:</p>
  
  <ol>
  <li><p>When this component is destroyed, is the <code>WebsocketService</code> instance also destroyed?</p></li>
  <li><p>If we were to provide this services in the root module (<code>app.module</code>), is service then a singleton? If this the case and the service is a singleton, when is this singleton created?</p></li>
  </ol>