ionic CLI 2.0.0-beta.25
angular2 2.0.0-beta.15
ionic-angular 2.0.0-beta.6
My database service is defined as a TypeScript interface with a couple implementations. I want to use a mock data implementation for development, and configure providers to use another production implementation when it’s ready.
db.ts
export interface MyDb {
}
mock-db.ts
@Injectable()
export class MockMyDb implements MyDb {
}
app.ts
@App({
templateUrl: ‘build/app.html’,
// http://ionicframework.com/docs/v2/api/config/Config/
config: {},
providers: [
provide(MyDb, {useClass: MockMyDb})
]
})
class MyApp {
rootPage: any = HomePage;
pageComponentFor: { [name: string]: any};
constructor(private app: IonicApp, private platform: Platform, public db: MyDb) {
This doesn’t work:
Uncaught ReferenceError: MyDb is not defined
Docs said this could be a string, but this results in an error too:
provide(‘MyDb’, {useClass: MockMyDb})
EXCEPTION: Cannot resolve all parameters for ‘MyApp’(IonicApp, Platform, Events, ?). Make sure that all the parameters are decorated with Inject or have valid type annotations and that ‘MyApp’ is decorated with Injectable.
Can I not use a TypeScript interface in this way? How do I retain the interface as an object in compiled JavaScript so that providers can use it?
Is there a trick to make the interface object retained in the compiled JavaScript code? declare var?
Use a class and extend instead of interface and implements?
What is the correct way to do this in TypeScript?
Also, it wasn’t until I found this blog that I realized you could put provide() calls within Ionic2’s App.providers[], so maybe that should be noted in the FAQ.