Как изменить объект, который передается дочернему компоненту с односторонним связыванием

Question

Я работаю с AngularJS 1.6 и компонентным веб-приложением. Я создаю новый компонент, который содержит таблицу, и при выборе строки отображается другой компонент без состояния с подробной информацией об объекте этих строк (строка передается через «<» - привязка). Пока это работает. Я использую компоненты с сохранением состояния и без состояния, и из Тодда Мотто я научился использовать одностороннее связывание (также при подготовке к переходу на Angular), и что для разрыва привязки JavaScripts я должен использовать следующий обработчик событий в компоненте без состояния(компонент детали в моем конкретном случае): </p>

ctrl.$onChange = function(changes) {
    if (changes.row) {
        this.row = angular.copy(this.row);
    }
};

Это работает в том смысле, что изменения в дочернем компоненте больше не изменяют объект в родительском компоненте, потому что привязка по ссылкесломана.

Проблема в : если я выберу другую строку в таблице, измененный объект больше не будет передаваться, компонент без сохранения состояния "не распознает" измененный объект в привязке! Если я пропущу приведенный выше код, он будет работать, но будет ли он работать при переходе на Angular? Что мне делать?

Answer 1

Скопируйте изменения:

ctrl.$onChange = function(changes) {
    if (changes.row) {
        ̶t̶h̶i̶s̶.̶r̶o̶w̶ ̶=̶ ̶a̶n̶g̶u̶l̶a̶r̶.̶c̶o̶p̶y̶(̶t̶h̶i̶s̶.̶r̶o̶w̶)̶;̶
        this.row = angular.copy(changes.row.currentValue);
    }
};

Из документов:

Хуки жизненного цикла

Директивные контроллеры могут предоставлять следующие методы, которые вызываютсяAngularJS в точках жизненного цикла директивы:

• $onChanges(changesObj) - вызывается при обновлении односторонних (<) или интерполяционных (@) привязок. changesObj - это хеш, ключи которого - это имена связанных свойств, которые изменились, а значения - это объект вида { currentValue, previousValue, isFirstChange() }. Используйте этот хук, чтобы запускать обновления внутри компонента, такие как , клонируя связанное значение, чтобы предотвратить случайную мутацию внешнего значения . Обратите внимание, что это также будет вызываться при инициализации ваших привязок.

Для получения дополнительной информации см.

• Справочник по API AngularJS - Справочник по Life-Цикл Крюки