如何使用 RABL 输出 json 日期数组
How do I output a json dates array with RABL
我正在尝试使用 chronoline.js 时间轴在我的 Rails 应用程序中显示事件。 chronoline 期望的格式是:
var events = [
{dates: [new Date(2015, 1, 29)], title: "First Event"},
{dates: [new Date(2015, 3, 9), new Date(2015, 3, 11)], title: "Second Event"}
];
日期节点是一个或两个日期的数组,具体取决于事件是否跨越多天。
我正在尝试使用 RABL 或 JBuilder 生成它,但我不明白如何创建数组或附加 "new Date"。
我是新手。我最终尝试在 RABL 视图中将它们全部连接起来:
collection @events
attributes :title
node :dates do |d|
if d.end.nil? then
"[new Date(" + d.start.to_s + ")]"
else
"[new Date(" + d.start.to_s + "), new Date(" + d.end.to_s + ")]"
end
end
...但这不起作用,因为它将整个数组语句输出为引号中的字符串。但是这样做无论如何感觉都不对。
如何将 RABL(或 JBuilder)获取到 assemble 数组?
您无法在来自 Rabl 或 jBuilder 的 JSON 响应中实现这一点,因为 Chronoline 需要 JavaScript 日期对象。
为此,我推荐以下内容:
1) 将您想要的 json 加载到数据属性中的视图中:
<%= content_tag :div, "", id: "mytimeline", data: { events: timeline_json(@events) } %>
2) 使用辅助方法构造您的 JSON,日期格式可以很容易地用 MomentJS 解析:
def timeline_json(events)
events.map { |event| { start: event.start.strftime("%F %T"), end: event.end.strftime("%F %T"), title: event.title } }.to_json
end
3) 安装 momentjs-rails gem,并确保它已加载到您的资产管道中。我们将使用它来解析 JSON 日期,以便轻松地将它们转换为 Javascript 日期对象。
4) 在 JavaScript 中使用 map,在实例化 Chronoline 时重铸日期对象。
function drawChronoline() {
// Load the Raw JSON data:
var raw_data = $("#mytimeline").data('events');
// Loop over the JSON, and map it into the format required by Chronoline. Here's a simple example to get you started:
var events = raw_data.map(function(event){
return { dates: [moment(event.start).toDate(), (!event.end ? null : moment(event.end).toDate())], title: event.title }
});
// Instantiate chronoline, with your mapped data:
var timeline = new Chronoline($("#mytimeline"), events);
}
如果您更喜欢使用 RABL 加载事件的异步方法(而不是使用 Helper 和数据属性),您可以使用以下方法轻松实现:
var raw_data = $.get("/events.json");
你的 RABL 看起来像:
collection @events
attributes :title
node(:start) { |event| event.start.strftime("%F %T") }
node(:end) { |event| event.end ? event.end.strftime("%F %T") : "" }
我正在尝试使用 chronoline.js 时间轴在我的 Rails 应用程序中显示事件。 chronoline 期望的格式是:
var events = [
{dates: [new Date(2015, 1, 29)], title: "First Event"},
{dates: [new Date(2015, 3, 9), new Date(2015, 3, 11)], title: "Second Event"}
];
日期节点是一个或两个日期的数组,具体取决于事件是否跨越多天。 我正在尝试使用 RABL 或 JBuilder 生成它,但我不明白如何创建数组或附加 "new Date"。
我是新手。我最终尝试在 RABL 视图中将它们全部连接起来:
collection @events
attributes :title
node :dates do |d|
if d.end.nil? then
"[new Date(" + d.start.to_s + ")]"
else
"[new Date(" + d.start.to_s + "), new Date(" + d.end.to_s + ")]"
end
end
...但这不起作用,因为它将整个数组语句输出为引号中的字符串。但是这样做无论如何感觉都不对。
如何将 RABL(或 JBuilder)获取到 assemble 数组?
您无法在来自 Rabl 或 jBuilder 的 JSON 响应中实现这一点,因为 Chronoline 需要 JavaScript 日期对象。
为此,我推荐以下内容:
1) 将您想要的 json 加载到数据属性中的视图中:
<%= content_tag :div, "", id: "mytimeline", data: { events: timeline_json(@events) } %>
2) 使用辅助方法构造您的 JSON,日期格式可以很容易地用 MomentJS 解析:
def timeline_json(events)
events.map { |event| { start: event.start.strftime("%F %T"), end: event.end.strftime("%F %T"), title: event.title } }.to_json
end
3) 安装 momentjs-rails gem,并确保它已加载到您的资产管道中。我们将使用它来解析 JSON 日期,以便轻松地将它们转换为 Javascript 日期对象。
4) 在 JavaScript 中使用 map,在实例化 Chronoline 时重铸日期对象。
function drawChronoline() {
// Load the Raw JSON data:
var raw_data = $("#mytimeline").data('events');
// Loop over the JSON, and map it into the format required by Chronoline. Here's a simple example to get you started:
var events = raw_data.map(function(event){
return { dates: [moment(event.start).toDate(), (!event.end ? null : moment(event.end).toDate())], title: event.title }
});
// Instantiate chronoline, with your mapped data:
var timeline = new Chronoline($("#mytimeline"), events);
}
如果您更喜欢使用 RABL 加载事件的异步方法(而不是使用 Helper 和数据属性),您可以使用以下方法轻松实现:
var raw_data = $.get("/events.json");
你的 RABL 看起来像:
collection @events
attributes :title
node(:start) { |event| event.start.strftime("%F %T") }
node(:end) { |event| event.end ? event.end.strftime("%F %T") : "" }