Exception self.context.XXX.subscribe is not a function

Question

In my Angular 2 app I need to pass an array from one component to another one. I have a component named SystemDynamicsComponent that exposes one array sdFactors:

@Component({
   selector: "system-dynamics",
   templateUrl: "/app/component/main/template/system-dynamics.html"
})

export class SystemDynamicsComponent implements OnInit {
    private dialogDisplayed: boolean = false;
   @Output() sdFactors: any[] = [];

In the component named InputModuleComponent I need to read this value as follows:

Template:

<system-dynamics (sdFactors)="this.sdFactors"></system-dynamics>

Component:

export class InputModuleComponent implements OnInit {
...
sdFactors: any[] = [];

When launchig the input module component, I receive this error message from Angular: TypeError: self.context.sdFactors.subscribe is not a function at Wrapper_SystemDynamicsComponent.subscribe (wrapper.ngfactory.js:38) at View_InputModuleComponent6.createInternal (component.ngfactory.js:3103) at View_InputModuleComponent6.AppView.create (core.umd.js:12262) at View_InputModuleComponent6.DebugAppView.create (core.umd.js:12666) at TemplateRef_.createEmbeddedView (core.umd.js:9320) at ViewContainerRef_.createEmbeddedView (core.umd.js:9552)

Any ideas what I am missing?

Answer 1

Try this

<system-dynamics (sdFactors)="sdFactors"></system-dynamics>

instead of

<system-dynamics (sdFactors)="this.sdFactors"></system-dynamics>

you dont need to add this in the template for binding. Variables from the same class can be accessed without this in the template.

Update

@output is used for event binding not for property binding , you have to use @input for passign array or some variable value so use this like this

<system-dynamics [sdFactors]="sdFactors"></system-dynamics>

and in you component like this

@Component({
   selector: "system-dynamics",
   templateUrl: "/app/component/main/template/system-dynamics.html"
})

export class SystemDynamicsComponent implements OnInit {
    private dialogDisplayed: boolean = false;
   @Input() sdFactors: any[] = [];