您好我正在使用Angular2开发一个应用程序 . 我通过一个api接收一个我必须在html表中显示的多维列表 .

这是我从api收到的json的简化版本:

{
  "events": [
    {
      "id": 0,
      "name": 0,
      "sub_events": [
        {
          "id": 0,
          "name": 0,
          "actions": [
            {
              "id": 0,
              "name": 0
            }
          ]
        }
      ]
    }
  ]
}

当我这样显示时,我试图隔离组件:

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>

我的所有组件都使用changeDetection:ChangeDetectionStrategy.OnPush

我希望当我点击一个动作时,Angular 2不会重新检查整个列表,只会重新检查单击的按钮 .

现在,Angular会对列表进行检查,检查所有事件上的所有事件,并在所有子事件上查看所有事件...

我尝试使用ChangeDetectorRef.detach,但它没有改变任何东西 .

我的根列表 events 是使用ImmutableJS创建的 .

有没有办法告诉angular只检查一个子组件而不重新检查整棵树?

先感谢您 ;)