title: Angular2 global service provider
body: <pre><code>/app
          - app.component.ts 
          - app.component.html (hide/show: menu bar)
          - app.global.service.ts (Public varible LoginSuccess:boolean)
          - main.ts
          /student
              - student.ts
              - student.service.ts
              - student.component.ts
              - student.component.html
          /security
              - login.component.ts (LoginSuccess = true)
              - login.component.html
  </code></pre>
  
  <p>In my application of Angular2, I have a simple need where I want to show hide menu bar based on login success. For that I created a service which just have a LoginSuccess boolean varilable, which I would set on login component and will use on app.component.html for <code>[hidden]=LoginSuccess</code> nav tag.</p>
  
  <p>Problem I am facing is, even after injecting <code>app.global.service.ts</code> thru <code>constructor</code> of <code>app.component.ts &amp; login.component.ts</code> value is not persisting and each constructor creating new object of <code>app.global.service.ts</code>. </p>
  
  <p>Question: How can I achieve to persist single value across application thru service. Somewhere in Angular2 docs, I did read that Injectable service is singleton.</p>