0

这是一个项目管理应用程序，有很多项目都有开始日期和结束日期。

我希望有一个时间表页面，其中显示项目及其时间表，例如甘特图聊天。每个项目占用表格的一行，并且时间表（持续时间）在年历中突出显示。

我正在使用 html 和 agularJS。我使用 ng-repeat 检索包含项目名称、开始日期和结束日期的项目列表。

我不知道如何做年历并在日历上显示动态时间表。

4

2 回答 2

1

有一个名为AngularUI的很棒的项目，它专门使用 UI 元素构建，用于您尝试做的事情。其中之一是日历。您可以按照自己的意愿使用他们的日历 UI 元素来显示项目。

你说你正在使用 ng-repeat；因此，您的 $scope 中已经有一个列表。您可以简单地转换数据，使其具有所需的属性（标题、开始和其他一些可选属性，如结束日期）并将其传递到日历元素，例如：

$scope.events = [
      {title: 'All Day Event',start: new Date(y, m, 1)},
      {title: 'Long Event',start: new Date(y, m, d - 5),end: new Date(y, m, d - 2)},
      {id: 999,title: 'Repeating Event',start: new Date(y, m, d - 3, 16, 0),allDay: false},
      {id: 999,title: 'Repeating Event',start: new Date(y, m, d + 4, 16, 0),allDay: false},
      {title: 'Birthday Party',start: new Date(y, m, d + 1, 19, 0),end: new Date(y, m, d + 1, 22, 30),allDay: false},
      {title: 'Click for Google',start: new Date(y, m, 28),end: new Date(y, m, 29),url: 'http://google.com/'}
    ];
于 2013-02-28T17:22:19.457 回答
0

您可以尝试将 dhtmlxGantt（一个 JavaScript 甘特图库）与 AngularJS 一起使用。这是一个教程：http ://www.dhtmlx.com/blog/?p=2200

dhtmlxGantt 具有可自定义的时间刻度。

（免责声明：我是 DHTMLX 团队的一员）。

于 2014-04-07T10:11:37.840 回答