[angular] Angular2 변경 감지 : 중첩 된 객체에 대해 ngOnChanges가 실행되지 않음

나는 이것에 대해 처음으로 질문하지는 않지만 이전 질문에서 답을 찾을 수 없다는 것을 알고 있습니다. 나는 이것을 하나의 구성 요소로 가지고 있습니다.

<div class="col-sm-5">
    <laps
        [lapsData]="rawLapsData"
        [selectedTps]="selectedTps"
        (lapsHandler)="lapsHandler($event)">
    </laps>
</div>

<map
    [lapsData]="rawLapsData"
    class="col-sm-7">
</map>

컨트롤러 rawLapsdata에서 때때로 변경됩니다.

에서 laps, 데이터는 표 형식으로 HTML로서 출력된다. 변경 될 때마다 rawLapsdata변경됩니다.

내 map구성 요소의 요구에 사용하는 ngOnChanges구글지도에 마커를 다시 그리기 트리거로. 문제는 rawLapsData부모 가 변경 될 때 ngOnChanges가 실행되지 않는다는 것 입니다. 어떡해?

import {Component, Input, OnInit, OnChanges, SimpleChange} from 'angular2/core';

@Component({
    selector: 'map',
    templateUrl: './components/edMap/edMap.html',
    styleUrls: ['./components/edMap/edMap.css']
})
export class MapCmp implements OnInit, OnChanges {
    @Input() lapsData: any;
    map: google.maps.Map;

    ngOnInit() {
        ...
    }

    ngOnChanges(changes: { [propName: string]: SimpleChange }) {
        console.log('ngOnChanges = ', changes['lapsData']);
        if (this.map) this.drawMarkers();
    }

업데이트 : ngOnChanges가 작동하지 않지만 lapsData가 업데이트되는 것처럼 보입니다. ngInit에는 줌 변경을위한 이벤트 리스너가 있으며this.drawmarkers . 줌을 변경하면 실제로 마커가 변경되는 것을 볼 수 있습니다. 따라서 유일한 문제는 입력 데이터가 변경 될 때 알림을받지 못한다는 것입니다.

부모님에게는이 줄이 있습니다. 변경 사항은 랩에는 반영되지만 맵에는 반영되지 않습니다.

this.rawLapsData = deletePoints(this.rawLapsData, this.selectedTps);

그리고 this.rawLapsData그 자체가 큰 json 객체의 중간을 가리키는 포인터입니다.

this.rawLapsData = this.main.data.TrainingCenterDatabase.Activities[0].Activity[0].Lap;

답변

   rawLapsData = Object.assign({}, rawLapsData);

rawLapsData = somevalue; // change detection will not happen

rawLapsData = {...somevalue}; //change detection will happen

rawLapsData = rawLapsData.slice(0);