首页 > 解决方案 > 在日视图中呈现角度 ui 日历上的数据

问题描述

$scope.calandarCall = function(allTasks) {
  $scope.tasks = allTasks;
  $scope.guestname = [];
  for (var i = 0; i < $scope.tasks.length; i++) {
    $scope.guestname.push($scope.tasks[i].name);
  }
  $scope.uiConfig = {
    calendar: {
      height: 450,
      editable: true,
      allDaySlot: false,
      defaultView: "agendaWeek",
      header: {
        left: 'agendaDay',
        center: 'title',
        right: 'today prev,next'
      },
      slotEventOverlap: false,
      hiddenTime: [7, 8],
      dayNamesShort: $scope.guestname,

      eventClick: $scope.alertEventOnClick,
      eventDrop: $scope.alertOnDrop,
      eventResize: $scope.alertOnResize,
      eventRender: $scope.eventRender
    }
  };
  var obj = {};
  for (var i = 0; i < $scope.tasks.length; i++) {
    obj = {
      title: $scope.tasks[i].service,
      start: $scope.tasks[i].startDateTime,
    }
    $scope.eventSources[0].events.push(obj);
  }
}
$scope.eventSources = [];

$scope.eventSources = [
  // your event source
  {
    events: [], // put the array in the `events` property
    color: 'black', // an option!
    textColor: 'yellow' // an option!
  }
  // any other event sources...
]
<div ui-calendar="uiConfig.calendar" ng-model="eventSources"></div>

我有对象数组形式的现有数据,并希望在日视图中针对引用他们预定活动时间的客人姓名(即时间与客人姓名)实现 angular-ui 日历。

  1. 如何在 ui 上呈现现有数据?
  2. 如何使用日历添加新活动?

标签: javascriptangularjsangularjs-directivefullcalendarui-calendar

解决方案


推荐阅读