0

El caso es el siguiente, estoy usando ésta directiva de AngularJS que en realidad es un plugin de bootstrap hecho directiva. La directiva en cuestion acepta un atributo options que es de two-way binding y está dentro un ng-repeat, algo asi:

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

Como pueden ver la directiva es un date-range-picker. Dentro del objecto que se le pasa al atributo options se puede especificar una fecha mínima a partir de la cual elegir. Lo que yo quiero es que la fecha mínima sea la máxima fecha del picker anterior en el repeat.

Para eso el objeto options es algo así:

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

Entonces este objeto se tiene que generar dinámicamente cuando el modelo del item anterior en el array se actualiza. Se me ocurrio armar una función que tome como parámetro el $index y devuelva el objeto. En el marcado me quedo:

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

y en el controlador tengo:

$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: {}
    };
};

Funciona, pero con unos errores en la consola cada vez que se actualiza el model como el siguiente:

introducir la descripción de la imagen aquí

Estuve investigando y sé que es porque la función si bien devuelve un objeto con las mismas caracteristicas, éste es un nuevo objeto cada vez, no es idempotente, entonces vuelve a lanzar el digest por que piensa que cambió hasta que llega al máximo.

Probé algunas cosas que ví en internet como agregar un $$hashKey como se menciona en éste hilo, quedando el objeto:

$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)
    };
};

Pero sin resultados. Se agradece si alguno conoce la forma correcta de bindear un modelo a traves de una función sin que se disparen los $digest loops. Saludos y gracias por leer.

6
  • $index creo que es undefined, necesitas algo como item in list track by $index el 6 dic. 2018 a las 15:40
  • podrias colocar el json que recibe list el 6 dic. 2018 a las 15:42
  • @JackNavaRow angular siempre crea un $index dentro de un ng-repeat. Por otro lado el array que recorre es trivial e irrelevante, el problema esta donde lo describi en la pregunta, por eso trate de mostrar mi logica y ser lo mas preciso posible. Saludos! el 6 dic. 2018 a las 22:34
  • El mindate y el maxdate dicen fechas de localidad y no en formato m-d-y el 7 dic. 2018 a las 0:45
  • @JackNavaRow es por que el objeto options es más completo del simple ejemplo que use en la pregunta, tiene una opción de locale donde se pueden configurar esas cosas. De verdad ya debuggie yo mísmo donde ocurre el error y como bien dije en la pregunta, sé cual es. Lo único que necesito es un work around para bindear un modelo a través de una función el 7 dic. 2018 a las 13:49

0

Tu Respuesta

By clicking “Publica tu respuesta”, you agree to our terms of service and acknowledge you have read our privacy policy.

Examina otras preguntas con la etiqueta o formula tu propia pregunta.