Angular2 injizieren Mutter Service in Kind

Question

Da habe ich einfach app Komponente:

import {Component} from 'angular2/core'; 
import {bootstrap} from 'angular2/platform/browser'; 
import {AppComponent} from 'ng2-easy-table/app/app.component'; 
import {ConfigService} from "./config-service"; 

@Component({ 
    selector: 'app', 
    directives: [AppComponent], 
    providers: [ConfigService], 
    template: ` 
    <ng2-table [configuration]="configuration"></ng2-table> 
    ` 
}) 
export class App { 
    constructor(private configuration:ConfigService) {} 

} 
bootstrap(App, []); 

und ng2-table, die über npm install installiert wird, und in node_modules Verzeichnis abgelegt wird.

import {Component, OnInit, Input} from 'angular2/core'; 

@Component({ 
    selector: 'ng2-table', 
}) 

export class AppComponent implements OnInit{ 
    @Input configuration; 
    constructor() { 
    console.log("configuration: ", this.configuration); // <-- null 
    } 

    ngOnInit() { 
    console.log("configuration: ", this.configuration); // <-- null 
    } 
} 

und dieser Konfigurationsservice:

import {Injectable} from "angular2/core"; 
@Injectable() 
export class ConfigService { 
    public searchEnabled = true; 
    public orderEnabled = true; 
    public globalSearchEnabled = true; 
    public footerEnabled = false; 
    public paginationEnabled = false; 
    public exportEnabled = true; 
    public resourceUrl = "http://beta.json-generator.com/api/json/get/E164yBM0l"; 
} 

In app Komponente I ng2-table Komponente setzen. ng2-table und app sind Root-Komponenten, so dass ich nicht zu verwenden @Input() erlaubt (dies ist der Grund, warum [configuration]="configuration" nicht (https://stackoverflow.com/a/33155688/1168786) im Anschluss an diese Antwort funktioniert
Die Frage ist -. Wie kann ich einen Dienst von app Komponente in ng2-table Komponente injizieren, aber nicht mit @Input()

Wie gebe ich einige config meine ng2-table oder noch einfacher, wie kann ich Komponente von node_modules initialisieren, welche einige config in Konstruktor erwartet

Dies ist Komponente Link:.? https://github.com/ssuperczynski/ng2-easy-table/tree/master/app

Answer 1

@Input in @Input configuration; fehlt () sollte es

@Input() configuration; 

sein Ich habe Ihren Code in den Plunker kopiert und hinzugefügt () behoben.

Plunker example

Answer 2

Diese Linie scheint nicht richtig zu sein, da ich denke, dass Sie die configuration Ausdruck ausgewertet werden soll:

<ng2-table [configuration]="'configuration'"></ng2-table> 

Ich würde verwenden die folgenden statt

<ng2-table [configuration]="configuration"></ng2-table> 

Außerdem würde ich injizieren Ihren Dienst (wenn es ist eigentlich ein Service) auf diese Weise:

(...) 
import {ConfigService} from "./config-service"; 

export class App { 
    constructor(private configuration: ConfigService) { 
    } 
} 

Answer 3

Winkelabhängigkeit Injektion die gleiche Instanz von ConfigService das Kind Komponente als p liefern Arent-Komponente, solange sie nicht explizit in der Eigenschaft providers der untergeordneten Komponente angegeben ist. Dies ist auf das hierarchische DI-Modell von Angular zurückzuführen, weitere Informationen finden Sie unter docs. Basierend auf den Codebeispielen, es sieht aus wie ConfigService könnte mit DI nicht, so dass Sie es in eine injizierbare aussehen möchten wie auch beim Einschalten: DI info