Question

我正在尝试使用ui bootstrap模式框向ui日历添加新事件。但是，它没有在日历上显示。下面我创建了日期点击事件的功能，其中包含模态框的代码：

$scope.dayClickEvent = function(date,jsEvent,view){

       //open model view for adding a event title
      var creatEventModalInstance = $modal.open({
              templateUrl: '/js/schedule/event_modal.html',
              controller: function($scope, $modalInstance){

                  $scope.add = function(event){

                       $modalInstance.close(event);
                  };


                  $scope.close = function(){

                       $modalInstance.dismiss('cancel');
                  };
              }

     });

以下是日历的ui配置代码：

 $scope.uiConfig = {
        calendar:{
                  height:   450,
                  editable: true,
        header:{
                  left:   'month basicWeek basicDay agendaWeek agendaDay',
                  center: 'title',
                  right:   'today prev,next'
      },
         dayClick: $scope.dayClickEvent
    }
};

此事件源的代码为ui日历提供有关事件的数据：

 $scope.eventSources = {
        events: [
            {
                title: 'Event1',
                start: '2015-01-18'
            },
            {
                title: 'dsadas',
                start: '2015-01-18'
            }

            // etc...
        ],
        color: 'yellow',   // an option!
        textColor: 'black' // an option!
    };

所以，我做错了什么，并提前感谢。

Answer 1

$ scope.eventSources是一个数组，包含一个或多个事件源对象。
它是一种扩展形式，旨在允许您添加多个事件源。

Event Source Object包含events数组以及与事件相关的任何Event Source Options - 例如文本或背景颜色。

因此，您必须为每个事件源添加对象 - 然后在对象中包含events数组 - 以及任何选项。

...在您的示例中，您将events数组直接放在$scope.eventSources 对象中 ...

纠正：
- 使$scope.eventSources数组即使用[方括号]
- 将events:[]数组放在一个对象中，即在{花括号}
中
尝试这样的事情：

$scope.eventSources = [ //this is event source object #1 { events: [ // put the array in the `events` property { title: 'Event1', start: '2015-01-24' }, { title: 'Event2', start: '2015-01-28' } ], color: 'black', // an Event Source Option! textColor: 'yellow' // an Event Source Option! } ];

如this回答所述，您可以通过引用对象添加多个来源，例如：

$scope.eventSources = [$scope.eventSourceObject1, $scope.eventSourceObject2, etc...],

（您可以随意调用您的事件源对象，只要它们构造正确）

同样，每个事件源都必须是包含里面的events数组的对象。

angularjs ui日历没有显示添加的事件

1 个答案: