Javascript 多上传预览不'；不要保存所有的图像

在我的rails应用程序中，我试图为我的表单创建一个多上传预览功能。我正在使用ActiveStorage。 但当我试图上传多张图片时，它只保存其中一张图片。实际上，它是每次保存的最后一个图像，其他所有图像都不是

我正在使用Desive进行注册，使用邪恶向导进行多步骤操作，使用cancancan进行授权。我也在使用rails管理员

应用程序控制器

def configure_permitted_parameters
devise_parameter_sanitizer.permit(:sign_up, keys: [:professions, :gender, :clinic_logo, :clinic_zip_code, clinic_images: []])
devise_parameter_sanitizer.permit(:account_update, keys: [:professions, :gender, :clinic_logo, :clinic_zip_code, clinic_images: []]) 
end

def user_params
params.require(:user).permit(:professions, :gender, :clinic_logo, :clinic_zip_code, clinic_images: []
)
end

注册\u步骤控制器

def configure_permitted_parameters
devise_parameter_sanitizer.permit(:sign_up, keys: [:professions, :gender, :clinic_logo, :clinic_zip_code, clinic_images: []])
devise_parameter_sanitizer.permit(:account_update, keys: [:professions, :gender, :clinic_logo, :clinic_zip_code, clinic_images: []]) 
end

def user_params
params.require(:user).permit(:professions, :gender, :clinic_logo, :clinic_zip_code, clinic_images: []
)
end

我的表格

<%= form_for @user, url: wizard_path, method: :put do |f| %>

<div class="photos">

<% if @user.clinic_images.attached? %>
  <% @user.clinic_images.each do |image| %>

<div class="image-show">    
<%= image_tag(image.variant(resize: "100x100")) %>
   </div>
  <% end %>

<% end %>

<div class="image-upload"> 
<div class="overlay" id="oldDivImages"><div class="overlay-icon">+</div>
 <%= f.file_field :clinic_images, multiple: true, accept:'image/*', id: "gallery-photo-add" %> 
     </div>
<div class="overlay-text">Tilføj billede</div>

</div>
<div class="gallery"></div>

</div> 
<% end %>

+
蒂尔夫约比勒德

JS

<script>
$(function() {
    // Multiple images preview in browser
    var imagesPreview = function(input, placeToInsertImagePreview) {

        if (input.files) {
            var filesAmount = input.files.length;

            for (i = 0; i < filesAmount; i++) {
                var reader = new FileReader();

                reader.onload = function(event) {
                    $($.parseHTML('<img>')).attr('src', event.target.result).appendTo(placeToInsertImagePreview);
                }

                reader.readAsDataURL(input.files[i]);
            }
        }

    };

    $('#gallery-photo-add').on('change', function() {
        imagesPreview(this, 'div.gallery');
    });
});
</script>

$（函数（）{
//浏览器中的多图像预览
var imagesPreview=函数（输入，放置到插入图像预览）{
if（input.files）{
var filesamunt=input.files.length；
对于（i=0；i

您的控制器看起来像什么？是否允许强参数？是否将诊所图像的强参数设置为

诊所图像：[]

？没错，我忘了像数组一样设置强参数，但现在出现语法错误。我用参数更新了问题。任何嵌套属性，如

clinic\u images:[]

需要排在列表的末尾。我不知道为什么，但除非像这样的参数都排在列表的末尾，否则它永远不会对我起作用。好吧，现在它不会给我带来错误，但只保存了一张图像。看看更新的问题有人知道如何修复吗？我想不出来。