IFormFile as a Nested ViewModel Property

前端 未结 1 1469
广开言路
广开言路 2021-01-12 08:38

I\'m trying to use IFormFile as a property in a nested ViewModel. I am running into issues trying to bind the ViewModel to the controller action at runtime. The AJAX request

相关标签:
1条回答
  • 2021-01-12 08:49

    The AJAX request stalls and never reaches the action.

    This is a known issue that has been fixed in v3.0.0-preview and won't be merged into 2.2.x branch. See see #4802.

    When posting a form with IList<Something> Something where Something has a property of IFormFile directly, it will result in an infinite loop. Because the model binding happens before the invocation of action method, you'll find that it never enters the action method. Also, if you inspect the Task Manager, you'll find that a crazy memory usage.

    To walk around it, as suggested by @WahidBitar, simply create a wrapper on the IFormFile so that Something doesn't have a IFormFile directly .

    As for your question itself, change your code as below:

        public class ProductViewModel
        {
            public ProductDTO Product { get; set; }
            public List<ProductImageViewModel> Images { get; set; }
        }
    
    
        public class ProductImageViewModel
        {
            public ProductImageDTO ProductImage { get; set; }
            // since this ProductImageViewModel will be embedded as List<ProductImageViewModel>
            //     make sure it has no IFormFile property directly
            public IFormFile ImageFile { get; set; }
            public IFormFileWrapper Image{ get; set; }  
    
            // a dummy wrapper
            public class IFormFileWrapper
            {
                public IFormFile File { get; set;}
            }
        }
    

    Now your client side should rename the field name as below:

    Images[0].ProductImage.Prop1     # Your DTO prop's
    Images[0].Image.File             # instead of Images[0].ImageFile
    Images[0].ProductImage.Prop2     # Your DTO prop's
    Images[1].Image.File             # instead of Images[1].ImageFile
    ...                              # other images
    Product.Prop1
    Product.Prop2
    ...                              # other props of Product
    

    A Working Demo :

    0 讨论(0)
提交回复
热议问题