// Import the core angular services. import { Component } from "@angular/core"; // ----------------------------------------------------------------------------------- // // ----------------------------------------------------------------------------------- // interface GreeterInterface { greeting() : string; } class NiceGreeter implements GreeterInterface { public greeting() : string { return( "Hello, what a pleasure to meet you." ); } } // CAUTION: Here, I am saying that the "MeanGreeter" IMPLEMENTS the "NiceGreeter." class MeanGreeter implements NiceGreeter { public greeting() : string { return( "Hello, you are a doofus!" ); } } // ----------------------------------------------------------------------------------- // // ----------------------------------------------------------------------------------- // @Component({ selector: "my-app", providers: [ // For this application, let's provide the MeanGreeter instance when the // NiceGreeter needs to be injected into the App component. { provide: NiceGreeter, useClass: MeanGreeter // <--- Defining the swappable implementation. } ], styleUrls: [ "./app.component.css" ], template: ` <p> <strong>Greeting:</strong> {{ greeting }} </p> ` }) export class AppComponent { public greeting: string; // I initialize the app component. constructor( greeter: NiceGreeter ) { this.greeting = greeter.greeting(); } }