10 итераций $ digest () при использовании собственных ссылок в объявлениях литералов объектов

Question

Я объявляю массив следующим образом:

vm.arr = [{
    type: {
        model: null,
        get constraints() {
            return MyFactory.buildTypeConstraints(this.model);
        } 
    },
    value: {
        model: null,
        get constraints() {
            return MyFactory.buildConstraints(this.model);
        } 
    },
    niveau: null
}];

И затем в HTML я зацикливаю этот массив:

<div layout-gt-sm="row" ng-repeat="entry in controller.arr">
    <div class="md-block" flex-gt-sm>
        <link link-model="entry.type.model" constraints="entry.type.constraints" flex-gt-sm "/>
    </div>
    <div class="md-block" flex-gt-sm>
        <link link-model="entry.value.model" constraints="entry.value.constraints" flex-gt-sm "/>
    </div>

    <div class="md-block" flex-gt-sm>
        <md-input-container>
            <rate ng-model="entry.niveau" allow-half-star="false" label="Niveau" />
        </md-input-container>
    </div>
</div>

Но я получаю эту ошибку:

Ошибка: [$ rootScope: infdig] 10 $ digest () достигнуты итерации.Отмена!

Что также говорит о том, что новое значение из MyFactory.buildTypeConstraints(this.model) отличается от его старого значения, даже если они совпадают.

Как я могу решить эту проблему?

Answer 1

MyFactory.buildTypeConstraints() определенно возвращает новые экземпляры объекта.

Даже если они равны по значению, они не одинаковы (это разные экземпляры), поэтому он запускает обнаружение нового изменения и, следовательно, новый цикл дайджеста.

Возможно, вам следует использовать angular.equals, чтобы свойство не возвращало новый экземпляр объекта, если значение не изменилось.

let typeConstaints, valueConstraints;
vm.arr = [{
    type: {
        model: null,
        get constraints() {
            let constr = MyFactory.buildTypeConstraints(this.model);
            if(!angular.equals(typeConstaints, constr)) typeConstaints = constr;
            return typeConstaints;
        } 
    },
    value: {
        model: null,
        get constraints() {
            let constr = MyFactory.buildTypeConstraints(this.model);
            if(!angular.equals(valueConstraints, constr)) valueConstraints= constr;
            return valueConstraints;
        } 
    },
    niveau: null
}];