onChanges не работает с привязкой компонента

Question

У меня есть компонент:

@Component('Umbrella', {
    selector: 'attachment-list',
    templateUrl: '/AttachmentListComponent/AttachmentList.html',
    bindings: {
        mediaIds: '<',
    }
})

public $onChanges() {
   console.log(this.mediaIds);
}

Я использую компонент в CaseFlowComponent:

Компонент:

У меня есть метод загрузки:

public upload = (file: File) => {
    if (!file || !this.state.caseHistory) return;

    this.uploadService
        .upload({
            url: this.actionUrl,
            data: { file },
            method: 'POST'
        })
        .then((result: any) => {
            this.state.caseHistory.media.push(result.data);
            this.setMediaIds(result.data.id);
        });
};

И метод, который помещает идентификатор загруженного файла в массив mediaIds.

private setMediaIds(mediaId: Guid) {
    this.mediaIds.push(mediaId);
}

Шаблон:

<attachment-list 
    media-ids='vm.mediaIds'
></attachment-list>

Идентификатор загруженного файла добавляется правильно для массива this.mediaIds в caseFlowComponent, но $onChanges не вызывается в компоненте attachment-list.

Я думал, $onChanges должно работать при обновлении привязки компонента.

Answer 1

$onChanges сравнивает ссылки. Возможны следующие варианты:

• всегда создавать новый массив
• добавить еще один вход для запуска при изменении
• запустить просмотр вручную