Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Angular2 ES6 @Input alternative

I'm trying to build a <markdown-component> using ES6 syntax. The @Input syntax sugar isn't supported in ES6 and I can't find a viable alternative.

I'm defining the input in the parent with:

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

Then accepting the input using:

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

If I add a template I can get it will output the value as expected but there's no way to use the input in the constructor.

This module should actually be a directive, and the source value will define the path to the Markdown file being loaded.

like image 827
Evan Plaice Avatar asked Dec 28 '15 19:12

Evan Plaice


1 Answers

Thanks to @Eric Martinez's comment, I was able to get it working.

The inputs aren't available until the OnInit phase of the lifecycle.

The following worked:

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

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

I was trying to access the input in the constructor, before the inputs were initialized.

like image 128
Evan Plaice Avatar answered Oct 13 '22 14:10

Evan Plaice