bind policy attribute by a function

0

The case is this, I'm using this policy AngularJS which is actually a bootstrap plugin made directive. The directive in question accepts an attribute options that is two-way binding and is within a ng-repeat , something like this:

<div ng-repeat="item in list">
    <date-range-picker options="options" ng-model="item.date"></date-range-picker>
</div>

As you can see the directive is a date-range-picker . Within the object that is passed to the attribute options you can specify a minimum date from which to choose. What I want is for the minimum date to be the maximum date of the previous picker in the repeat.

For that the options object is something like this:

const options = {
    opens: 'center',
    minDate: 'DD-MM-YYYY',
    maxDate: 'DD-MM-YYYY',
    eventHandlers: {}
}

Then this object must be generated dynamically when the model of the previous item in the array is updated. It occurred to me to put together a function that takes as a parameter the $index and returns the object. In the marking I stay:

<div ng-repeat="item in list">
    <date-range-picker options="options($index)" ng-model="item.date"></date-range-picker>
</div>

and in the controller I have:

$scope.options = function (index) {
    const minDate = index > 0 ? moment($scope.list[(index - 1)].date.endDate).format('DD-MM-YYYY') : '01-01-2018'

    return {
        opens: 'center',
        minDate: minDate,
        maxDate: '31-12-2018',
        eventHandlers: {}
    };
};

It works, but with some errors in the console each time the model is updated like the following:

I was investigating and I know that it is because the function returns an object with the same characteristics, this is a new object every time, it is not idempotent , then it launches the digest again because it thinks which changed until it reaches the maximum.

I tried some things that I saw on the internet like adding a $$ hashKey as mentioned in this one thread , leaving the object:

$scope.options = function (index) {
    const minDate = index > 0 ? moment($scope.list[index].date.endDate).format('DD-MM-YYYY') : '01-01-2018'

    return {
        opens: 'center',
        minDate: minDate,
        maxDate: '31-12-2018',
        eventHandlers: {},
        $$hashKey: JSON.stringify(this)
    };
};

But without results. It is appreciated if anyone knows the correct way to binde a model through a function without triggering the $ digest loops. Greetings and thanks for reading.

    
asked by gauchoscript 06.12.2018 в 16:22
source

0 answers