如何访问data.home._children循环中的自定义字段 [英] How to access custom fields in a data.home._children loop

问题描述

我在lib/modules/apostrophe-custom-pages/index.js中添加了一些自定义字段

具体来说，我为摘录添加了一个字段，为封面图像添加了图像Singleton，并允许用户为页面定义图标.

这是这些图像的定义方式:

  {名称:"icon"，标签:图标"，类型:"singleton"，widgetType:撇号图像"，选项:{限制:1minSize:[200,200]，AspectRatio:[1,1]，}，控制项:{可移动的:false}，图片:真实}，{名称:"coverimg"，标签:标题图片"，类型:"singleton"，widgetType:撇号图像"，选项:{限制:1minSize:[400,400]，AspectRatio:[1,1]，}，控制项:{可移动的:false}，图片:真实} 

我可以使用以下命令在页面上检索的封面图像和图标: {％set coverimage = apos.images.first(data.page.coverimg)或null％} ，

但是，我无法在导航中的 data.home._children 下找到该图标，如下所示:

  {％-用于data.home._children-％中的选项卡{％-set iconImg = apos.images.all(tab.icon)％}{{apos.log(tab)}}< li>< a class ="sidebar-main-link{％如果data.page和(apos.pages.isAncestorOf(tab，data.page)或tab._id == data.page._id)％}积极的{％ 万一 ％}"href =" {{tab.slug}}>< div class ="icon" style =backgroung-image:url('{{’.attachments.url(image.attachment，{size:'full'})}}'')></div>{{tab.title}}</a></li>{％endfor％} 

这将返回标准的 missing.svg 图片

解决方案

撇号文档站点上有一个新教程，详细介绍了此问题.

简短的回答是，您必须配置撇号页模块的 filters 选项，以加载不仅具有非常基本信息的相关页面.出于性能原因，此默认行为不是一件坏事，但是让Apostrophe仅加载一个小部件不会使事情变慢.

 //在lib/modules/apostrophe-pages/index.js中module.exports = {//其他配置，然后...过滤器:{祖先: {孩子们: {区域:['thumbnail']}}}}; 

I've added a few custom fields in lib/modules/apostrophe-custom-pages/index.js

Specifically, I've added a field for an excerpt, image Singleton for a cover image and another Singleton that will allow users to define an icon to a page.

This is how these images are defined:

 {
    name: 'icon',
    label: 'Icon',
    type: 'singleton',
    widgetType: 'apostrophe-images',
    options:{
        limit: 1,
        minSize: [200,200],
        aspectRatio: [1,1],
    },
    controls:{
      movable:false
    },
    image: true
  },
 {
    name: 'coverimg',
    label: 'Header Image',
    type: 'singleton',
    widgetType: 'apostrophe-images',
    options:{
        limit: 1,
        minSize: [400,400],
        aspectRatio: [1,1],
    },
    controls:{
      movable:false
    },
    image: true
  }

The cover image and the icon I can retrieve while on the page by using: {% set coverimage = apos.images.first(data.page.coverimg) or null %} ,

however, I can't reach the icon in the navigation under data.home._children like so:

    {%- for tab in data.home._children -%}
      {%- set iconImg = apos.images.all(tab.icon) %}
      {{ apos.log(tab) }}
    <li>
      <a class="sidebar-main-link 
      {% if data.page and (apos.pages.isAncestorOf(tab, data.page) or tab._id == data.page._id) %}
        active
      {% endif %}
      " href="{{ tab.slug }}">

        <div class="icon" style="
        backgroung-image: url('{{ apos.attachments.url(image.attachment, { size: 'full'}) }}')  "></div>
        {{ tab.title }}

      </a>
    </li>
  {% endfor %}

This returns the standard missing.svg image

解决方案

There is a new tutorial on the apostrophe documentation site which covers this issue in detail.

The short answer is that you must configure the filters option of the apostrophe-pages module to load related pages with more than just very basic information. For performance reasons, this default behavior is not a bad thing, but asking Apostrophe to load just one widget won't slow things down too much.

// in lib/modules/apostrophe-pages/index.js
module.exports = {
  // other configuration, then...
  filters: {
    ancestors: {
      children: {
        areas: [ 'thumbnail' ]
      }
    }
  }
};

这篇关于如何访问data.home._children循环中的自定义字段的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！