angular日历指令未在jquery选项卡中呈现

Question

关于角度日历指令的另一个问题。我需要在一个页面上显示多个日历，并且正在使用jquery选项卡小部件。但是，只有一个日历可以正确渲染。在普通的jquery fullCalendar中，您使用"render"方法来确保在选择选项卡时显示日历。然而，这似乎不适用于angular ui日历指令。

这是一个演示我的意思的plunker。删除$（）.tabs（），三个角度的日历就会显示得很好。用标签把它们包起来，它就不再工作了：

http://plnkr.co/edit/HEEX4iqb8kFAsjwdGmkM

关于为什么不起作用以及如何解决这个问题，有什么想法吗？

谢谢！

PS。我将在谷歌群组中交叉发布这个问题。谢谢

Answer 1

尽管有完整的日历文档，"show"似乎不是触发完整日历（"nder"）的地方。我应该说，至少在使用Angular时不是这样。我不知道在正常的jQuery使用下这是否正确。改为使用"激活"事件：

$("#tabs").tabs({
  activate: function(){
    ("#calendar").fullCalendar('render');
  }
});

http://plnkr.co/edit/HEEX4iqb8kFAsjwdGmkM

Answer 2

渲染时使用超时。

<tab heading="{{tabs[0].title}}" active="tabs[0].active" select="renderCalendar()" disabled="tabs[0].disabled">

     $scope.renderCalendar = function() {
               $timeout(function(){
                    $('.calendar').fullCalendar('render');
                }, 0);
        };