Hello i am developing an application with Angular2. I recieve via an api a
multi-dimensional list that I must display in an html table.
Here is the simplified version of the json that I receive from the api:
{
"events": [
{
"id": 0,
"name": 0,
"sub_events": [
{
"id": 0,
"name": 0,
"actions": [
{
"id": 0,
"name": 0
}
]
}
]
}
]
}
I tried to isolate the components when displaying like this:
*ListComponent*:
<event-view [event]='event' *ngFor="let event of events"></event-view>
*EventComponent: (event-view selector)*
<div>
<h1>{{event.id}} {{event.name}}</h1>
<table>
<tr subevent-view [subEvent]='subEvent' *ngFor="let subEvent of
event.sub_events"></tr>
</table>
</div>
*SubEventComponent: (subevent-view selector)*
<td>{{subEvent.id}}</td>
<td>{{subEvent.name}}</td>
<td>
<event-action [action]='action' *ngFor="let action of
subEvent.actions"></event-action>
</td>
*EventActionComponent: (event-action selector)*
<button (click)='....' >{{action.name}}</button>
All my components use changeDetection: ChangeDetectionStrategy.OnPush
I would like that when I click on an action Angular 2 does not recheck the
whole list but only the clicked button.
For now Angular does a check on the list + one check on all events + one on
all subevents + one on all actions ...
I tried using ChangeDetectorRef.detach but it does not change anything.
My root list *events* is created with ImmutableJS.
Is there a way to tell angular to check only one child component without
re-checking the whole tree?
I ve made a plunker of my problem
http://plnkr.co/edit/aVMD4IMg6bxwcMvhZ271?p=preview
(the checks are logged in the console)
If someone has already had problems with unnecessary checking
Help me please [image: :wink:]
Thank you in advance ;)
--
You received this message because you are subscribed to the Google Groups
"Angular" group.
To unsubscribe from this group and stop receiving emails from it, send an email
to [email protected].
To post to this group, send email to [email protected].
Visit this group at https://groups.google.com/group/angular.
For more options, visit https://groups.google.com/d/optout.
