md-dialog不会在当前日历上呈现

时间:2018-02-20 04:04:31

标签: angularjs fullcalendar ng-show

我正在使用fullcalendar在日历中显示一系列记录。它运作得很漂亮。

我现在正尝试添加点击一天添加新活动的功能。我在下面添加了dayClick代码:

$("#calendar").fullCalendar({
    ...
    dayClick: function (date, jsEvent, view) {
        $scope.AddDailyRecord(date);
    },
    ...
});

函数AddDailyRecord如下:

$scope.AddDailyRecord = function (date) {
    if (date) {
        $scope.reportDate = date.format("YYYY-MM-DD");
        $scope.reportToDate = date.format("YYYY-MM-DD");
    } else {
        var newDate = moment(new Date()).format("YYYY-MM-DD");
        $scope.reportDate = newDate;
        $scope.reportToDate = newDate;
    }
    $scope.statusJob = "";
    if ($scope.statusDetForeman)
        $scope.dailyRecordForeman = $scope.statusDetForeman;
    else
        $scope.dailyRecordForeman = appData.user;

    $scope.showDailyRecordDiv = true;
}
$scope.closeDailyRecordDialog = function () {
    $scope.showDailyRecordDiv = false;
}

此按钮已使用相同的代码:

<button class="md-raised md-primary detailGridAddButton md-button md-ink-ripple" 
        type="button" ng-transclude="" ng-click="AddDailyRecord()">
   <md-icon class="ng-scope material-icons" role="img" aria-label="add">add</md-icon>
   <div class="md-ripple-container" style=""></div>
</button>

这是有问题的md-dialog(显示我如何切换显示/隐藏):

<div id="dailyRecordDiv" class="md-dialog-container ng-scope full-height" 
     ng-show="showDailyRecordDiv">
    <md-dialog>
        <md-toolbar>
            ...
        </md-toolbar>
        <md-divider></md-divider>
        <md-dialog-content class="md-dialog-content">
            <form name="dailyRecordform" novalidate>
                ...
            </form>
        </md-dialog-content>
    </md-dialog>
</div>

单击按钮时,它会正确显示对话框。但是,当我点击代码执行的那一天,但没有对话框。但是,如果我单击日历箭头以查看另一个月(之前或之后),则对话框就在那里。

我需要做些什么才能让它在当前日历上呈现?

1 个答案:

答案 0 :(得分:1)

运行后

$scope.AddDailyRecord(date);

在范围

上运行apply
$scope.$apply()

fullCalendar dayClick回调超出了控制器的范围。