Текущая ситуация:

у меня естьparent иchild составная часть.

parent инициализируетchildданные с использованием его@Input, Иchild уведомляет родителя, когда пользователь отредактировал данные, используя@Output, И потому чтоданные неизменны,child должен отправить данные вместе с этим уведомлением.

Когдаparent Получив уведомление, он проверит, верны ли представленные данные, а затем установит их (это распространит новое значение также на некоторые другие дочерние компоненты).

Эта проблема:

При установке новых данных внутриparent, это, конечно, также даст егоchild компонент, который только что представил данные. Это вызоветchild«sngOnChanges, который затем вызывает перерисовку пользовательского интерфейса.

Немного предыстории:

parent имеет несколько разныхchild компоненты, которые все полагаются на то жеmyItem данные и могут редактировать эти данные, а затем уведомитьparent по изменению.

Вот упрощенная версия кода, которая должна показать проблему.

Родительский компонент:

template:
    <child [input]="myItem" (output)="onMyItemChange($event)">

code:
    ngOnInit() {
        this.myItem = getDataViaHTTP();
    }

    onMyItemChange($event) {
        if($event.myItem.isValid()) {
            this.myItem = $event.myItem;
        }
    }

Дочерний компонент:

template:
    <input [(ngModel)]="myItem.name" (ngModelChange)="modelChange($event)">

code:
    @Input() input;
    @Output() output = new EventEmitter();

    myItem;

    ngOnChanges(changes) {
        this.myItem = changes.input.currentValue.toMutableJS();
    }

    modelChange($event) {
        this.output.emit(this.myItem.toImmutableJS())
    }

Как видите,child Компонент берет данные из@Input и делает его изменчивым. И прежде чем отправить его обратно вparent это сделает его неизменным снова.

Есть ли какой-нибудь шаблон, чтобы предотвратить эти круговые события?