Pregunta

Entonces, tengo una aplicación de calendario donde ahora el usuario elige las fechas de inicio / finalización y los clics Actualizar calendario. Esto llena un calendario. Sin embargo, estoy teniendo problemas incluyendo nuevos elementos en el alcance. Por ejemplo, en lugar de usar continuamente la misma función una y otra vez para calcular la "Fecha de la célula" para alguna célula desde la fecha de inicio, el número de la semana, el día de la semana, etc., quiero almacenar la fecha de la celda una vez en su alcance Y deja que todos los demás lo usen. De alguna manera, no puedo hacer esto a pesar de muchos intentos. En el A inferiorización de JSFIDDLE, notará los días de la pantalla del mes en la esquina superior derecha de cada celda de calendario. Sin embargo, si cambia las fechas, para decir un mes anterior, los días de la actualización del mes, pero la "Fecha de la celda" que he mostrado en la celda no se actualiza.

Por ejemplo, tome "SAT 05 2014". Actualice las fechas para comenzar a los 6/1, y la celda de la lejana derecha sigue siendo "sentada jul 05 2014" ¡Aunque su día del mes refleja el 7 de junio! El código relevante está en la directiva "callell" y la directiva "eventos". En Callell, configuro la CELLD como NG-INIT= 'CELLD= CELLDATE (NUM, START_DT, $ índice)'. Luego, en los eventos, simplemente se muestra usando {{CELLD}}. Podría hacerlo trabajar usando CellDate (NUM, START_DT, $ INDEX) en eventos, pero realmente no quiero usar la misma función un millón de veces en todas partes. ¿Hay alguna forma en que puedo almacenar la fecha de la celda en el objeto celular y simplemente usarlo en el alcance de los niños y tenerlo actualizado cuando los datos cambian? Eventualmente, estaré pasando la fecha de la celda a una función para obtener datos de eventos para esa fecha, entonces los eventos se iterarán sobre ellos para mostrar los datos de eventos.

Link Link

app.directive("events", function($compile, DateService) {
        return {
            restrict: "A",
            replace: true,
            scope: true,
            template: 
                    "<div>{{celld}}</div>",
            link: function(scope, element, attrs) {
                scope.DateService = DateService;
            }
        }
    });

    //calendar cell 
    app.directive("calcell", function($compile, DateService) {
        return {
            restrict: "A", 
            replace: true, 
            scope: true,
            template: 
                "<td ng-init='celld=cellDate(num, start_dt, $index)' id='{{\"td\" + DateService.getDateInt(cellDate(num, start_dt, $index))}}' \
                        realclass='{{getScopeClass(cellDate(num, start_dt, $index))}}'>\
                    <div>\
                        <a class='CellDay'>{{DateService.getMonthDay(cellDate(num, start_dt, $index))}}</a>\
                    </div>\
                    <br/>\
                    <br/>\
                    <br/>\
                    <br/>\
                    <div events></div>\
                    </div>\
                </td>",
            link: function(scope, element, attrs) {                 
                scope.DateService = DateService;
            }
        }
    }); 

¡Gracias!

¿Fue útil?

Solución

Pude hacer que funcione al colocar la Celld en la etiqueta de evento.No estoy seguro si eso ayuda.

<div events ng-attr-celld='{{cellDate(num, start_dt, $index)}}'></div>

No es necesario reemplazarlo y el ATR es el valor de alcance.

//replace: true,
...
scope: {celld:'@'}

Fiddle

y si aún no lo ha visto - Calendario de la UI angular - podría ahorrarun tiempo.

Licenciado bajo: CC-BY-SA con atribución
No afiliado a StackOverflow
scroll top