ag-grid : 참조 된 노드의 계층 적 트리 : 참조 된 속성을 편집 가능하게 만드는 방법은 무엇입니까?

새로운 Angular2 프로젝트를 위해 멋진 ag-Grid 구성 요소 (정말 멋집니다!)를 테스트하고 있습니다. "구조"( "트리"라고도 함)가있는 CAD 모델 구조를 표시하는 데 사용해야하며 각 노드는 CAD 모델의 속성입니다.

이제 ag-Grid에서 트리를 만드는 것이 가능합니다. 가장 단순한 형태의 data속성은 노드의 속성 (CAD 모델 속성)을 보유합니다. 이 경우 editable: truecolumnDefs에 속성 을 할당하여 셀을 편집 가능하게 만들 수 있습니다 .

그러나 문제는 구조 (트리)의 여러 위치에서 CAD 모델을 사용하고 하나를 편집하면 나머지는 모두 변경되지 않는다는 것입니다.

대신 CAD 모델 (노드)은 실제로 데이터 자체가 아니라 데이터에 대한 참조 여야 합니다. 좋아, ag-Grid에 문제가 없습니다. 여기에서 복사 된 노드가있는 트리와 참조 된 노드 가있는 트리 간의 비교를 볼 수 있습니다 .

노드는 트리에 복사됩니다.

ag-Grid의 rowData :

rowData = [
  {
    data: { modelName: 'partA', weight: 12.5 }
    children: [ ... ]
  }
];

ag-Grid의 열 정의는 다음과 같습니다.

{
  headerName: 'weight',
  field: 'weight',
  editable: true
}

노드는 트리에서 참조됩니다.

ag-Grid의 rowData :

rowData = [
  {
    data: { model: MODEL_OBJECT }
    children: [ ... ]
  }
];

여기서 MODEL_OBJECT는 모델 객체에 대한 자바 스크립트 참조입니다. 예를 들면 다음과 같습니다.

var modelA = { modelName: 'partA', weight: 12.5 }

그리고 열 정의를 다음과 같이 변경하십시오.

{
  headerName: 'weight',
  valueGetter: 'data.weight',
  editable: true
}

보다? 동일한 속성이 트리에 표시되지만 실제로는 참조 된 POJS 개체에서 가져옵니다. 따라서 모델은 트리의 용도간에 공유 됩니다 .

지금까지 모두 좋습니다. 하지만 이제는 valueGetterfor 열 weight이 있으므로 열을 직접 편집 할 수 없습니다. 더 정확하게 말하면 ag-Grid는 편집을 허용하지만 값을 수정하지는 않습니다. 글쎄, 이것은 valueGetter가 다른 방향으로 "가역"될 수없는 매핑 함수로 작용하기 때문에 이해할 수 있습니다. 'data.firstName + data.lastName'과 같은 것을 고려하십시오. ag-grid가 업데이트 방법을 어떻게 알 수 있는지 data.firstname또는 data.lastName사용자가 열에 다른 값을 입력하는지 여부.

내 질문 : 참조 된 트리 노드 의 편집 가능한 셀을 갖는 목표를 어떻게 달성 할 수 있습니까? 의도 한 효과는 트리의 한 위치에서 CAD 모델의 속성을 편집하면 그리드가 참조를 통해 다른 모든 발생을 자동으로 업데이트한다는 것입니다.