在成功的ajax响应中加载模式html

我有一个返回

ViewComponent

的视图控制器，它返回一个包含我需要的所有内容的视图（.cshtml）

在另一个视图中，我想使用它，因此我对控制器进行ajax调用，以在响应中获得原始html

模态

在我的ViewComponent中，我返回如下视图：

return View("~/Views/MyModal.cshtml", new MyViewModel()
            {
                Id = obj.id
            });

下面是一个演示：

cshtml（您希望将数据传递给控制器，因此需要在ajax中使用

键入：“POST”

）：

视图组件/样本1：

 public class Sample1:ViewComponent
    {
        public async Task<IViewComponentResult> InvokeAsync(Sample1Model s)
        {
            return View("~/Views/Shared/Default.cshtml",s);
        }
    }

视图：

---

我已经更新了我的问题，但是我返回了带有注入数据的视图…它已经可以使用了，这就是为什么我在ajax中使用GET…现在只有在我的JS中成功了，我需要阅读它并打开模式，它与我在响应中得到的HTML完全相同…这可能吗？

返回视图（~/Views/Shared/Default.cshtml），s）在视图组件中，它可以工作。您也可以使用部分视图来完成。我已经更新了关于部分视图和返回视图的答案（“~/Views/Shared/Default.cshtml”，s）视图中的组件。
return View("~/Views/MyModal.cshtml", new MyViewModel()
            {
                Id = obj.id
            });

<!-- Modal -->
<div class="modal fade" id="myModal" role="dialog">
    <div class="modal-dialog">

        <!-- Modal content-->
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-
                        dismiss="modal">
                    &times;
                </button>
                <h4 class="modal-title">Modal Header</h4>
            </div>
            <div class="modal-body">
                <p>Some text in the modal.</p>
            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-default" data
                        dismiss="modal">
                    Close
                </button>
            </div>
        </div>

    </div>
</div>
@section scripts{ 
<script>
    $(function () {
        var Id = 1;
        $.ajax({
            url: '/Test1/RetunSample1ViewComponent',
            type: 'POST',
            data: {
                Id: Id
            },
            success: function (data) {
                $('#myModal').modal('show').html(data);
            },
            error: function (error) {
                console.error(error);
            },
        });  
    })
    
</script>
}

        public IActionResult TestViewComponent() {
            return View();
        }
        public IActionResult RetunSample1ViewComponent(int Id) {
            return ViewComponent("Sample1", new Sample1Model { Id = Id , Name="sample1"}); ;
        }

 public class Sample1:ViewComponent
    {
        public async Task<IViewComponentResult> InvokeAsync(Sample1Model s)
        {
            return View("~/Views/Shared/Default.cshtml",s);
        }
    }

@model Sample1Model
Id:<input asp-for="Id" />
Name:<input asp-for="Name" />

public IActionResult ReturnPartialView(int Id) {
            return PartialView("~/Views/Shared/Default.cshtml", new Sample1Model { Id = Id, Name = "sample1" });
        }

 $(function () {
        var Id = 1;
        $.ajax({
            url: '/Test1/ReturnPartialView',
            type: 'POST',
            data: {
                Id: Id
            },
            success: function (data) {
                $('#myModal').modal('show').html(data);
            },
            error: function (error) {
                console.error(error);
            },
        });  
    })