切换月份和行显示时的ui-calendar问题

时间:2015-11-20 13:23:11

标签: javascript angularjs calendar fullcalendar angular-ui

我正在使用ui-calendar v:1.0.1, fullcalendar v:2.4.0,

有我的问题:当我在日历中的几个月之间切换时,所有这些都消失了。 我做了一项研究,发现从angular-ui-calendar 279行修改calendar.js

eventsWatcher.onAdded = function(event) {
calendar.fullCalendar('renderEvent', event, (event.stick ? true : false));
};

eventsWatcher.onAdded = function(event) {
calendar.fullCalendar('renderEvent', event, (event.stick ? true : false));
};

诀窍。 但我正在寻找更好的解决方案。

我对日历的2º问题是,有时它不能正确渲染线条,当我改变窗口的尺寸时,会出现一些线条而其他线条会消失。

现在是代码。

<div class="col-lg-8">
      <h3 class="section-subheading text-muted"></h3>
      <div ui-calendar="uiConfig.calendar" class="span8 calendar" ng-model="eventSources"></div>
</div>

和控制器。

angular.module('lararraizApp')
.controller('EventoCtrl', function ($scope, Evento, uiCalendarConfig, $q) {


$scope.eventos = Evento.query();
$scope.eventSources=[[]];
/*    Evento.query({}, function(response) {
  angular.forEach(response, function(evento){
    $scope.eventSources.push({
      id: evento.id,
      title: evento.name,
      start: evento.fecha,
      allDay: true
    });
  });
});*/

Evento.query().$promise.then(function(res){
  angular.forEach(res, function(evento){
    $scope.eventSources[0].push({
      id: evento.id,
      title: evento.name,
      start: evento.fecha,
      allDay: true
    });
  });
});
//$scope.eventSources.push({title: 'All Day Event',start: new Date(),url: 'http://www.angularjs.org'});

//$scope.eventSources = [$scope.events];

$scope.uiConfig = {
  calendar: {
    lang: 'es-es',
    header: {
      left: 'title',
      right: 'prev,next'
    },
    firstDay: 1,
    monthNames: ['Enero', 'Febrero', 'Marzo', 'Abril', 'Mayo', 'Junio', 'Julio', 'Agosto', 'Septiembre', 'Octubre', 'Noviembre', 'Diciembre'],
    closeText: 'Cerrar',
    prevText: '<Ant',
    nextText: 'Sig>',
    currentText: 'Hoy',
    monthNamesShort: ['Ene', 'Feb', 'Mar', 'Abr', 'May', 'Jun', 'Jul', 'Ago', 'Sep', 'Oct', 'Nov', 'Dic'],
    dayNames: ['Domingo', 'Lunes', 'Martes', 'Miércoles', 'Jueves', 'Viernes', 'Sábado'],
    dayNamesShort: ['Dom', 'Lun', 'Mar', 'Mié', 'Juv', 'Vie', 'Sáb'],
    dayNamesMin: ['Do', 'Lu', 'Ma', 'Mi', 'Ju', 'Vi', 'Sá'],
    weekHeader: 'Sm',
    dateFormat: 'dd/mm/yy',
    selectable: true,
    selectHelper: true,
    unselectAuto: true,
    isRTL: false,
    showMonthAfterYear: false,
    yearSuffix: '',
    eventClick: function(calEvent, jsEvent, view) {

      angular.forEach($scope.eventos, function (e, i) {
        if (e.id === calEvent.id) {
          $scope.eventoAct = e;
        }
      });

    },
    dayClick: $scope.alertOnEventClick
  }
};
});

任何帮助都会被贬低。

问候。

1 个答案:

答案 0 :(得分:5)

最后我会回答我自己的问题。

您只需要将属性栏添加到true,当您在月份之间切换时,它们就不会消失。

    $scope.events.push({
      id: evento.id,
      title: evento.name,
      start: evento.fecha,
      allDay: true,
      stick:true //trick
    });

非常感谢。

关于线渲染问题我仍然坚持这一点。我已经检查过一些浏览器是否正确显示它,所以我不知道它是否是编码或库存问题。