give an Array with Data from one Component to another

[Bernd Wachter]

Hello,

I have a Angular 4 Component (Component-1)
in this Component i call a Web API they gives me Product Data back..

in this Component-1 in the HTML File i use this Syntax..

<app-component2>[products]='products'</app-component2>

ok in the Component-2 i have a @Input Decorator like this

@Input()products:any[];

in the Component-2 HTML i can give the Data correct out... this works.

but i have the Problem now i want to integrate a special Pager and for this i must
have access to the Array of Objects i become from the Component1 via Input.....

i must make something like this to bring the Data in a new Array of Objects....

@Input()products: any;
public allItems:any;

ngOnInit()
{
this.allItems = this.products;
}

a i must have the Object Data where i become from the Component1 in Component2 and put them
in a new Array of Data Objects....

but i cannot access in the Code of the Data products !!
in the HTML i have access to the Data and can give them out,

but in the .ts File i cannot access to the Data products...

have someone an Idea what i make wrong ???

Thanks  

[Sander Elias]

Hi Bernd,

The issue you have is unclear to me, can you put in some extra explanation, or an plunk showcasing what the problem is you have?

Regards

Sander

[Bernd Wachter]

In the Component1 i send the Data to Component2
in Component2 i become the DataObject in the @Input

then i can show the Data in the View of Component2
this works and i can see all the Data....

this means the Data comes ok to the Component2

but now i want this DataObject where i become in the @Input first give to a Pager Function
to show only the Data from the Pager  --- shows only 10 Items ... like this...

and for this i must give the DataObject where i from the Component1 to Component2 > @Input

to my Pager Function to manipulate them first before i show the filtered Data from the Pager in the View!

and my Problem is now to become this DataObject from the @Input in another Dataobject
like this mynewObject = Object from where i become from the @Input !!

i become always undefined back!!!!!!

i think the Problem is somewhere where i want to bring the Data in my new Array of DataObjects...
i think at this Point the Object is not accesible ?

I test this in the ngOnInit()....

but when i say there myArraywithnewData = myArraywhereIBecomeFromThe@Input

i become always undefined back!!!

a.. i become some Array of DataObjects from Component1 to Component2 via the @Input
and then i want to take this Array with DataObjects in Component2 and save them in a new Array of Dataobjects to work with them first (filter)
before i show the manipulated Data in the View....

i think the Problem is someone in the Lifecycle or i must someone wait until the Data loaded finish before i can bring
them in a new Array...

i hope now you can understand what i want

Thanks

Benny

[Sander Elias]

Hi Bernd,

No, sorry. Can you write a code-example preferably a working on in a plunker? With that, I see what it is you are trying to do. My JS is better as my English ;)

Regards

Sander