Title: Looping binded @input on ngFor - not updated properly
Tags: angular;typescript;ngfor
Question: I have a component with two binded inputs (one big array and two markers (positions) for the array).

Component:

```export class listSequence  { 
@Input() info: Data;
@Input() position: Markers;
..
...}
```

View

I'm looping the binded data @input and using the @input markers (position.start and position.end) to slice only wanted elements 
(markers could change in any moment).

```<g *ngFor="#p of info.data  | slice:position.start:position.stop+1 ; let i = index "&gt;..</g&gt;
```

When one of marker changes while the info.data is looping sometimes the results are messed. 

Sometimes one iteration (or two) are treated later after the change on markers (position.start or position.stop).

After updating component.start iterations should go from i:0 to i:14



Comment: Do you modify `Data` and `Markers` on the outside (where they are passed in)

Comment: I think you need to provide a Plunker that allows to reproduce. It's hard to guess about code that's not visibile and a subtle bug without being able to observe it happening.

Comment: yes in another component also using the same @input Marker. ---->  this.position.start = '10'

Comment: I could do that.  The info.data loop is not loading properly (sometimes) after changes in @input (as you can see in the console.logs screen capture)

Comment: in app.ts I load a big array, (notice the array ends with "X","Y","Z" elements). dragging the navigator makes you move on the array that is displayed below.  When you drag the left side of navigator to the right sometimes elements are messed. you can check the  "X","Y","Z" and console to see how the iterator messes sometimes


Here is another answer: plnkr link

In app.ts I load a big array, (notice the array ends with "X","Y","Z" elements).

Dragging the navigator makes you move on the array displayed below (red section). When you drag the left side of navigator towards the right sometimes elements are not displayed in the correct position. you can check with the "X","Y","Z" at the end.

Also in the console you can see how the iterator is messed (sometimes)


{'source': 'StackExchangeDataset', 'subset': 'stackoverflow.com', 'metadata': {'AnswerCount': 1, 'CommentCount': 5, 'ContentLicense': 'CC BY-SA 3.0', 'CreationDate': '2016:00:06/14/16', 'FavoriteCount': None, 'PostTypeId': 1, 'Tags': '<angular><typescript><ngfor>', 'Title': 'Looping binded @input on ngFor - not updated properly', 'ViewCount': 171, 'id': 37814343, 'user_AboutMe': '', 'user_AccountId': 3220814.0, 'user_DisplayName': 'viceo', 'user_Reputation': 36.0, 'user_Views': 3.0, 'user_id': 2718332.0}}