十月 CMS |如何从后端文件上传器获取组件中图像的路径？

Question

所以我有我的插件设置（或者我相信）但是出于某种原因，在 default.htm 文件中，我无法使用文件上传通过后端获取我上传的图像的路径小部件。

例如：<img src="{{ plugin.upload.path }}"> 不会向我显示图像的路径，但如果我显示 <img src="{{ plugin.upload.first.path }}"> 或 <img src="{{ plugin.upload.[0].path }}"> 我确实得到了图像的路径，但这不是'不太理想，因为我想显示多张图片。

我觉得我遗漏了一些非常简单的东西，但请原谅我的无知，因为我对 10 月还很陌生。

提前谢谢你。

components/gallerys/default.htm:

{% set gallerys = __SELF__.gallery %}

<ul>
{% for gallery in gallerys %}

<li>{{ gallery.uploads.path }}</li>

{% endfor %}
</ul>

components/Gallerys.php:

<?php namespace MartinSmith\Gallerys\Components;

use Cms\Classes\ComponentBase;
use MartinSmith\Gallerys\Models\Gallery;

class gallerys extends ComponentBase
{

public $gallery;

public function componentDetails(){
    return [
        'name' => 'Frontend Gallery',
        'description' => 'A gallery for you webpage'
    ];
}

public function onRun(){
    $this->gallery = $this->loadGallerys();
}

protected function loadGallerys(){
    return Gallery::all();
}

}

models/Gallery.php:

<?php namespace MartinSmith\Gallerys\Models;

use Model;

/**
* Model
*/
class Gallery extends Model
{
use \October\Rain\Database\Traits\Validation;

/*
 * Disable timestamps by default.
 * Remove this line if timestamps are defined in the database table.
 */
public $timestamps = false;


/**
 * @var string The database table used by the model.
 */
public $table = 'martinsmith_gallerys_';

/**
 * @var array Validation rules
 */
public $rules = [
];

public $attachMany = [
    'uploads' => 'System\Models\File'
];

}

models/columns.yaml:

columns:
name:
    label: name
    type: text
    sortable: true
uploads:
    type: partial
    path: ~/plugins/martinsmith/gallerys/models/gallery/_image.htm

models/fields.yaml:

fields:
name:
label: Name
span: auto
type: text
uploads:
    label: Upload
    span: full
    mode: image
    useCaption: true
    thumbOptions:
        mode: crop
        extension: auto
    imageWidth: '200'
    imageHeight: '200'
    type: fileupload

Answer 1

你真的很接近它了。这是我认为正在发生的事情。您正在从模型 ( {% for gallery in gallerys %} ) 中检索项目数组。现在模型中的每个项目都可以接受图像数组，因为您使用的是 $attachMany ( {% for image in gallery.uploads %} )。因此，当您调用 {{ plugin.upload.first.path }} 或 {{ plugin.upload.[0].path }} 时，您正在获取数组的第一张图像并获取路径。

所以你需要做的就是：

{% set gallerys = __SELF__.gallery %}

<ul>
{% for gallery in gallerys %}

    {% for image in gallery.uploads %}

    <li>{{ image.path }}</li>

    {% endfor %}

{% endfor %}
</ul>

一个可以帮助您调试 OctoberCMS 的很棒的插件是 Twig Dump+（还有一个 Twig Dump 也可以，但我喜欢 Twig Dump+）。这允许您编写 {{ d(gallery.uploads) }} 以查看对象的转储。

十月 CMS |如何从后端文件上传器获取组件中图像的路径？

October CMS | How to get the path of an image in a component from the backend file uploader?

plugins

octobercms