title: Angular2 How can I override provider
body: <p>I'm new to Angular and have a question regarding provider overriding. I'd like to use this datepicker in my project <a href="https://www.npmjs.com/package/mydatepicker" rel="nofollow noreferrer">https://www.npmjs.com/package/mydatepicker</a>.</p>
  <p>I want to override locale provider this library's component uses. Here is example <a href="https://plnkr.co/edit/fS8IoJqB8PYvgNEVGIMY" rel="nofollow noreferrer">https://plnkr.co/edit/fS8IoJqB8PYvgNEVGIMY</a>.</p>
  <p>I extended <code>LocaleService</code> from library class (<code>my.locale.service.ts</code>) and want to use it instead of it, so I specified it in my module:</p>
  <pre><code>providers: [{provide: LocaleService, useClass: MyLocaleService }]
  </code></pre>
  <p>But it doesn't work, component still uses it's own <code>LocaleService</code>. How can I achieve this?</p>
  <p>Thank you!</p>