Question

我有问题！我需要将2个div中的日历标题分开。我需要年度首页和月份的顶级日历。我可以使用angular.element执行此操作，但我不明白该函数运行2次的原因。

这是我的代码。

配置FullCalendar

            titleFormat: {
                     month: 'MMMM YYYY'

            },
            header: {
                left: 'title,prev'
                center: 'title',
                right: 'next'
            },

现在在eventAfterAllRender我将我的代码分开并更改月份和年份的位置

 eventAfterAllRender: function (){            
        var fecha=angular.element('.fc-left').text().split(" ");   
        var mes=fecha[0];
        var ano=fecha[1];        
        console.log("veces");

    angular.element('.fc-left').html('<div><h2>'+ano+'</h2><button type="button" class="fc-prev-button fc-button fc-state-default"><span class="fc-icon fc-icon-left-single-arrow"></span></button></div>');
    angular.element('.fc-center').html("<h2>"+mes+"</h2>");
    },

但该函数运行2次，因此月份和年份未定义！此外，我试图把功能放在准备好但不行。

angular.element(document).ready(function () {
var fecha=angular.element('.fc-left').text().split(" "); 
      var mes=fecha[0];
      var ano=fecha[1];      
      console.log("veces");

  angular.element('.fc-left').html('<div><h2>'+ano+'</h2><button type="button" class="fc-prev-button fc-button fc-state-default"><span class="fc-icon fc-icon-left-single-arrow"></span></button></div>');
   angular.element('.fc-center').html("<h2>"+mes+"</h2>");
})

Answer 1

您可以尝试在viewRender而不是eventAfterAllRender回调中添加代码并拆分view.title

这样，只有在视图更改时，您的代码才会运行，例如即使您没有活动，也可以在第二天或第二天移动

https://fullcalendar.io/docs/display/viewRender/

例如

viewRender: function ( view ){      
    var fecha = view.title.split(" ");   
    var mes = fecha[0];
    var ano = fecha[1];        

angular.element('.fc-left').html('<div><h2>'+ano+'</h2><button type="button" class="fc-prev-button fc-button fc-state-default"><span class="fc-icon fc-icon-left-single-arrow"></span></button></div>');
angular.element('.fc-center').html("<h2>"+mes+"</h2>");
},

titleFormat年份和月份为2 div fullcalendar <div>年</div> <div>月</div>

1 个答案: