在调度程序呈现后动态设置 resourceOrder
Set resourceOrder dynamically after the scheduler was rendered
我在 Angular 1.5 应用程序中使用 fullCalendar Scheduler。
我将它包装到一个指令中,在指令中我有一个包含所有属性的配置对象
var calendarConfig = {
schedulerLicenseKey: '----------------------------',
resources: function (callback) {
scope.getResources()(callback);
},
resourceColumns: [
{
labelText: 'Name',
field: 'name'
},
{
labelText: 'Id',
field: 'id',
width: "85px"
}
],
resourceOrder: "name",
defaultView: "timelineMonth",
resourceLabelText: "Test",
resourceAreaWidth: "17%",
aspectRatio: '100%',
header: {
left: 'reorderBtn',
center: 'title',
right: 'prev next'
},
customButtons: {
sortName: {
text: 'reorderBtn',
click: function (oEvent) {
---------- how to perform the reordering inside here ? ----
}
}
},
eventClick: eventClick,
dayClick: dayClick,
viewRender: viewRender,
weekNumbers: true,
};
我注意到调度程序有一个名为 "resourceOrder" 的 属性,它在初始化时工作得很好。
我的用例是,当我按下按钮时,我希望看到按名称降序排列的资源。
我尝试使用
$(element).fullCalendar('getView').options.resourceOrder = "-name"
$(element).fullCalendar('render')
但是没用。
我可以手动对指令之外的资源进行排序,然后再次将排序后的资源重置为源,但我想避免这种情况并利用漂亮的 属性 "resourceOrder" 调度程序提供。
有什么想法吗?或者关于如何一次按一列对资源进行排序的任何最佳实践?
您可以使用 fullCalendar setters and getters.
动态设置或获取 fullCalendar 选项
你的情况:
$('#calendar').fullCalendar('option', 'resourceOrder', '-name');
对于 FullCalendar v5.0+
calendar.setOption('resourceOrder', '-name')
在 Angular2+ 和 FullCalendar5
中
resourceOrder 的默认值为:'id, title'
。覆盖默认值
calendarOptions: CalendarOptions = {
height: "500px",
resourceOrder: 'type1', // Here ...
// resourceOrder: '-type1', // If prefixed with a minus sign like '-type1', the ordering will be descending.
//resourceOrder: 'type1,type2', // Compound ordering criteria can be specified as a single string separated by commas.
resources: [
{
id: 'A',
title: 'Resource A',
type1: 10,
type2: 55
},
{
id: 'B',
title: 'Resource B',
type1: 12,
type2: 60
},
],
...
}
我在 Angular 1.5 应用程序中使用 fullCalendar Scheduler。
我将它包装到一个指令中,在指令中我有一个包含所有属性的配置对象
var calendarConfig = {
schedulerLicenseKey: '----------------------------',
resources: function (callback) {
scope.getResources()(callback);
},
resourceColumns: [
{
labelText: 'Name',
field: 'name'
},
{
labelText: 'Id',
field: 'id',
width: "85px"
}
],
resourceOrder: "name",
defaultView: "timelineMonth",
resourceLabelText: "Test",
resourceAreaWidth: "17%",
aspectRatio: '100%',
header: {
left: 'reorderBtn',
center: 'title',
right: 'prev next'
},
customButtons: {
sortName: {
text: 'reorderBtn',
click: function (oEvent) {
---------- how to perform the reordering inside here ? ----
}
}
},
eventClick: eventClick,
dayClick: dayClick,
viewRender: viewRender,
weekNumbers: true,
};
我注意到调度程序有一个名为 "resourceOrder" 的 属性,它在初始化时工作得很好。
我的用例是,当我按下按钮时,我希望看到按名称降序排列的资源。
我尝试使用
$(element).fullCalendar('getView').options.resourceOrder = "-name"
$(element).fullCalendar('render')
但是没用。
我可以手动对指令之外的资源进行排序,然后再次将排序后的资源重置为源,但我想避免这种情况并利用漂亮的 属性 "resourceOrder" 调度程序提供。
有什么想法吗?或者关于如何一次按一列对资源进行排序的任何最佳实践?
您可以使用 fullCalendar setters and getters.
动态设置或获取 fullCalendar 选项你的情况:
$('#calendar').fullCalendar('option', 'resourceOrder', '-name');
对于 FullCalendar v5.0+
calendar.setOption('resourceOrder', '-name')
在 Angular2+ 和 FullCalendar5
中resourceOrder 的默认值为:'id, title'
。覆盖默认值
calendarOptions: CalendarOptions = {
height: "500px",
resourceOrder: 'type1', // Here ...
// resourceOrder: '-type1', // If prefixed with a minus sign like '-type1', the ordering will be descending.
//resourceOrder: 'type1,type2', // Compound ordering criteria can be specified as a single string separated by commas.
resources: [
{
id: 'A',
title: 'Resource A',
type1: 10,
type2: 55
},
{
id: 'B',
title: 'Resource B',
type1: 12,
type2: 60
},
],
...
}