Sonata自动完成中如何自定义显示数据

How customize display data in Sonata autocomplete

我使用表单字段 sonata_type_model_autocomplete 并且我想要自定义显示。我想要自动完成,如图所示:

我是否理解正确,唯一的方法是覆盖模板 SonataAdminBundle:[=32= 中的块 sonata_type_model_autocomplete_selection_format ]:sonata_type_model_autocomplete.html.twig?如何在 documentation。 接下来,我必须创建一个自定义控制器,它将为我提供必要的数据并填写 route 选项。也许像 this.

没有简单现成的解决方案吗?

我找到了解决办法。

可以使用选项to_string_callback,因此不提供单个记录字段,并呈现模板。

class DemoAdmin extends Admin
{
    protected function configureFormFields(FormMapper $formMapper)
    {
        $templating = $this->templating;
        $formMapper
            ->add('movie', 'sonata_type_model_autocomplete', [
                'property' => 'title',
                'label' => 'Movie',
                'multiple' => false,
                'required' => false,
                'container_css_class' => 'select2-image',
                'to_string_callback' => function($entity, $property) use ($templating) {
                    return $templating->render(
                        'AcmeDemoBundle:Form/Type/sonata_type_model_autocomplete:movie.html.twig',
                        ['entity' => $entity]
                    );
                },
            ]);
    }
}

模板代码:

{% spaceless %}
    <div class="select2-image__autocomplete">
        <img
            src="{{ entity.webPath | apply_filter('autocomplete') }}"
            class="select2-image__image"
            alt="{{ entity.title }}"
        />
        <strong>{{ entity.title }}</strong>
        <div>{{ entity.announce }}</div>
    </div>
{% endspaceless %}

config.yml

avalanche_imagine:
    filters:
        autocomplete:
            type: thumbnail
            options: { size: [60, 60], mode: outbound }

SCSS

.select2-image {
  height: auto;
  .select2-choice {
    height: 72px; // height 60 + 12 padding
  }
  &__autocomplete {
    clear: both;
    height: 60px;
  }
  &__image {
    float: left;
    margin-right: 5px;
    width: 60px;
    height: 60px;
  }
}

结果