Comment écrire un constructeur du service qui nécessite des paramètres angulaires 2?

J'ai un composant qui déclare la MetricsService service. Ce service nécessite à la fois de modules http et deux chaînes de caractères qui définit l'hôte sna, l'authentification de la clé à utiliser.

Les paramètres de service est comme suit:

@Injectable()
export class MetricsService {
    constructor(
        private http: Http,
        public wsAuthKey: string,
        public wsHost: string
        ) {
        this.wsAuthKey  = wsAuthKey || "blahblahblahblahblahblahblahblah=";
        this.wsHost     = wsHost    || "https://preprod-admin.myservice.ws";
    }

Le composant qui l'utilise est écrite comme suit:

export class DatavizComponent implements OnInit, OnChanges {
    constructor(
        private zms: MetricsService,
    ) { 
    }

Ma question est comment dois-je écrire le composant constructeur de sorte que le tout fonctionne, y compris la substitution de l'hôte et de la clé (mais ne pas dépasser le http)?

Remarque : Le code tel qu'il est actuellement écrit ne compile pas.

Pour être plus précis, je dirais que le composant d'application-selon les données de quelque chose comme ceci:

 export class DatavizComponent implements OnInit, OnChanges {
        constructor(
            private zms = MetricsService("http://myhost.com", "mykey"),
        ) { 
        }

Mais si cela fonctionne, comment passer http?

MISE À JOUR APRÈS LA SOLUTION PROPOSÉE:

export class MetricsService {

    constructor(
        private http: Http,
        @Inject('wsAuthKey') @Optional() public wsAuthKey?: string,
        @Inject('wsHost') @Optional() public wsHost?: string
        ) {
        this.wsAuthKey  = wsAuthKey || "blahblah=";
        this.wsHost     = wsHost    || "https://preprod-admin.host.ws";


        console.log("MetricsService constructor="
            + " wsAuthKey="+this.wsAuthKey
            + ", wsHost="+this.wsHost
        );

    }

Le composant:

@Component({
    selector:    'dataviz-offers-volumes',
    templateUrl: 'app/dataviz.component.html',
    styleUrls:  ['app/dataviz.component.css'],
    encapsulation: ViewEncapsulation.None,
    providers: [
        {provide: 'wsAuthKey',  useValue: 'abc'}, 
        {provide: 'wsHost',     useValue: 'efg'}, 
    ],
})
export class DatavizComponent implements OnInit, OnChanges {

    @ViewChild('chart') private chartContainer: ElementRef;
    @Input() private graphId:string;
    @Input() private wsAuthKey:string;
    @Input() private wsHost:string;
    @Input() private maxSamples=12;

    constructor(
        private zms: MetricsService
    ) { 
    }

Dans le constructeur, le journal sont comme suit (valeur ne sont pas transmises):

MetricsService constructor= wsAuthKey=blahblah=, wsHost=https://preprod-admin.host.ws

où il devrait afficher " abc " et "efg'.

Mais je me demande si il n'y a pas un problème avec le composant que l'utilisation de dataviz composante.
Dans cette partie, les informations suivantes ont été adoptées:

@Input() private wsAuthKey:string;
@Input() private wsHost:string;

Comme je voudrais le tag en option de préréglage de l'hôte et de la clé:

                <h1>dataviz volume</h1>
                <div class="chartContainer left" title="Simultaneous offers via dataviz directive">
                    <dataviz-offers-volumes 
                        id="dataviz-volumes1"
                        [graphId]="graphId"
                        [wsAuthKey]="'myauthkey'"
                        [wsHost]="'http://myhost.com'"
                        [maxSamples]="123"
                    >
                    </dataviz-offers-volumes>
                </div>

OriginalL'auteur Stéphane de Luca | 2017-02-22