关于apos ajax附加到页面外的数据的说明
我想在我的项目中实现撇号Ajax功能,但遗憾的是,我不完全理解Ajax功能。我已经研究了上周的文档,但是我没有找到足够的关于这个主题的信息。我想问一下,是否可以在关于apos ajax附加到页面外的数据的说明,ajax,apostrophe-cms,Ajax,Apostrophe Cms,我想在我的项目中实现撇号Ajax功能,但遗憾的是,我不完全理解Ajax功能。我已经研究了上周的文档,但是我没有找到足够的关于这个主题的信息。我想问一下,是否可以在撇号片段页面之外使用数据apos ajax append 我创建了这样一个小部件: lib/modules/infinite-widgets/index.js module.exports = { extend: 'apostrophe-widgets', label: 'Infinite Widget', addFiel
撇号片段页面之外使用数据apos ajax append
我创建了这样一个小部件:
lib/modules/infinite-widgets/index.js
module.exports = {
extend: 'apostrophe-widgets',
label: 'Infinite Widget',
addFields: [
{
name: 'posts',
label: 'Posts',
type: 'array',
titleField: 'name',
schema: [
{
name: 'name',
type: 'string',
label: 'Name'
},
{
name: '_image',
type: 'joinByOne',
withType: 'apostrophe-image',
label: 'Image',
required: true,
filters: {
projection: {
attachment: 1,
description: 1,
title: 1
}
}
}
]
}
]
};
那么我可以修改这个查询,让它有一个加载更多按钮,或者更好的数据apos ajax无限滚动
,用于在一个小部件而不是一个片段中创建的数组的内容吗?不,使用数据apos ajax append
是不可能的。该特性专门用于撇号片段页面,例如,对于小部件,没有后端实现等待与之对话
相反,您应该考虑为您的小部件编写一个API,它为您提供了一个向服务器进行自己的API调用的位置。您可以在的源代码中看到该技术。感谢您提供此信息。稍后我将创建一个ajax小部件,它有自己的API调用返回到服务器,但现在我也可以创建带有撇号片段的无限滚动小部件。我想这对我现在来说是可行的。
lib/modules/infinite-widgets/views/widget.html
<div class="row margin">
<div class="col s12 m12">
<div class="radius
{% if data.widget.shadowOn == true %}
z-depth-1
{% endif %}
">
<div data-apos-ajax-context="infinite">
{% include "indexAjax.html" %}
</div>
</div>
</div>
</div>
lib/modules/infinite-widgets/views/indexAjax.html
<div data-apos-ajax-append>
{% for name in data.widget.posts %}
{% set image = apos.images.first(name._image) %}
<div class="card z-depth-0" style="
{%- if piece.backColor-%}
background-color:{{ piece.backColor }}
{% endif %}
">
<div class="card-image">
<img src="{{ apos.attachments.url(image, { size: 'one-sixth' }) }}" />
</div>
<div class="card-content">
{{ name.name }}
</div>
</div>
{% endfor %}
</div>
{# Load More button. Also outside data-apos-ajax-append, so it gets refreshed #}
{% if data.currentPage < data.totalPages %}
{# "Load More" button with the "append=1" flag #}
<a href="{{ data.url | build({ page: data.currentPage + 1, append: 1 }) }}">Load More...</a>
{% endif %}