Asp.net core mvc 如何将数据id值传递给ViewComponent

我想在模式对话框中使用ViewComponent编辑一些数据，我可以在屏幕上显示ViewComponent，当我单击按钮时，如果我硬编码一个值，它将检索正确的数据

@await Component.InvokeAsync("Contact", 2);  

或
@wait Component.InvokeAsync（“Contact”，new{id=2}）

但我看不出如何使Id依赖于我单击的按钮。理想情况下，我只想使用data-id。 我看到的所有示例都使用固定值

编辑：

ViewComponent在ModalTagHelper中使用，ModalTagHelper通过锚标记进行切换，但我也有一些首先触发的jQuery

$('.btnShow').on('click', function () {
    $('#hdnContactId').val($(this).data('id'));
    alert($('#hdnContactId').val());
});

<a href="#" data-toggle="modal" data-id="@Model.StudentContactId" data-target="#EditContact" class="btnShow btn btn-default">Edit</a>


<modal id="EditContact" title="Contact Details">
    <modal-body>
        @await Component.InvokeAsync("Contact", new { id=2 });
    </modal-body>
    <modal-footer>
        <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
        <button type="button" class="btn btn-primary">Save changes</button>
    </modal-footer>
</modal>

$（'.btnShow'）。在（'click'，函数（）{
$（'#hdnContactId'）.val（$（this.data（'id'））；
警报（$（'hdnContactId'）.val（））；
});
@wait Component.InvokeAsync（“Contact”，new{id=2}）；
接近
保存更改

好的，我终于想出了一个办法。
我从模式部分中删除了@await etc，因此默认情况下它不会获得任何数据。 然后在控制器中，我添加了：

public IActionResult ContactViewComponent(int Id) {  
    return ViewComponent("Contact", Id);  
}  

并将我的脚本更改为：

$('.btnShow').on('click', function (e) {
    $('#hdnContactId').val($(this).data('id'));
    var container = $(".modal-body");
    $.get("/Contact/ContactViewComponent?Id=" + $(this).data('id'), function (data) { container.html(data); });
});  

---

现在它可以工作了：）

Cab您可以分享一下按钮点击是如何调用此代码的吗？