2015-12-28 22 views
5

Sto provando a creare un <markdown-component> usando la sintassi ES6. Lo zucchero di sintassi @Input non è supportato in ES6 e non riesco a trovare un'alternativa valida.Angular2 ES6 @Input alternativo

sto definendo l'ingresso nel genitore con:

<ng2-markdown [source]="source"></ng2-markdown> 

Poi accettare l'ingresso usando:

@Component({ 
    selector: 'ng2-markdown', 
    inputs: [ 'source' ] 
}) 

Se aggiungo un modello che può ottenere il risultato sarà il valore come previsto ma non c'è modo di usare l'input nel costruttore.

Questo modulo dovrebbe essere effettivamente una direttiva e il valore source definirà il percorso del file Markdown in fase di caricamento.

+3

L'alternativa è corretta, ma al momento della costruzione non funzionerà. Deve essere in ngOnInit almeno. –

+0

@EricMartinez Grazie mille. Sono rimasto bloccato per ore. Aggiungerò una risposta che mostra cosa ha funzionato, spero che aiuterà gli altri. –

+0

Non si vuole usare '@ Input' perché non è ES6 ma allo stesso tempo si usa' @ Componente'. Come mai? – zeroflagL

risposta

2

Grazie al commento di @Eric Martinez, sono riuscito a farlo funzionare.

Gli ingressi non sono disponibili fino alla fase OnInit del ciclo di vita.

quanto segue lavorato:

... 
export class MarkdownComponent { 
    constructor() {} 

    ngOnInit() { 
    console.log(this.source); 
    } 
... 

cercavo di accedere all'ingresso nel costruttore, prima che gli ingressi sono inizializzati.

+0

non correlato, ma ho passato le ultime 1+ ore cercando di capire come includere una libreria esterna (speravo anche di usare un parser Markdown) nella mia app Angular 2 + SystemJS con scarso successo - come sei finito facendolo? – jjwon

+0

@jjwon Uso JSPM per gestire le importazioni. Si occupa dell'installazione del pacchetto, dell'installazione delle dipendenze e del mapping di tutto alle etichette in config.js. Mi dispiace per il parser Markdown, ho letteralmente creato quel repository ieri estraendo il componente da un altro progetto. Aggiungerò una nota per avvisare gli altri di resistere fino a quando non posso testare/verificare che funzioni. Se vuoi vedere un'implementazione funzionante, controlla il repository per il mio sito personale (evanplaice.com). –

+0

@jjwon Ho verificato che il componente markdown funziona quando è installato tramite JSPM. Ho anche creato un progetto separato per dimostrarne l'utilizzo. https://github.com/evanplaice/ng2-markdown-component-demo –