symfony4 - 设置占位符并重命名 'browse' 按钮

Question

我在 Bootstrap 中使用 Vich Uploader bundle for SF 4.0。我想设置一个占位符并重命名“浏览”按钮。

我已经尝试过:

• 使用“placehoder”属性 (FormType.php)

{{ form_widget(form.imageFile, { 'attr': {'class': 'form-control', 'placeholder': "Please attach picture"}} ) }}

• 添加“占位符”选项(错误)或标签选项(不做任何更改)

我该怎么做？

请在下面找到我的代码

FormType.php

->add('imageFile', VichFileType::class, [])

_form.html.twig

{{ form_widget(form.imageFile, { 'attr': {'class': 'form-control'}} ) }}
{{ form_errors(form.imageFile) }}

Answer 1

我假设您使用的是 bootstrap 4；我使用 webpack 根据需要重新编译 bootstrap，并在包含 bootstrap.scss 之前添加此 scss 代码:

$custom-file-text: (
        en: "Browse",
        it: "Sfoglia"
);

// Bootstrap and its default variables
@import "../node_modules/bootstrap/scss/bootstrap";

这样我就可以翻译或更改文件上传按钮。您可以使用此方法个性化 Bootstrap 的其他方面，请参阅 Bootstrap online documentation

如果你不使用 webpack，你应该通过在包含 bootstrap css 之后添加这个 css 来获得相同的结果

.custom-file-input:lang(en) ~ .custom-file-label::after {
  content: "Browse";
}

.custom-file-input:lang(it) ~ .custom-file-label::after {
  content: "Sfoglia";
}

您的 Symfony 4 应用程序支持的每种语言都需要一个条目