Question

我有一个ASP.NET CORE MVC应用程序，并且在其中一个视图中包含一个JavaScript文件。 JavaScript用于页面上的下拉菜单，该页面调用控制器上的函数以获取该下拉菜单的数据。

$(document).ready(function() {

    $('#accounts').change(function() {
        var url = '@Url.Content("~/")' + "GetMeters";
        var ddlsource = "#accounts";

        $.getJSON(url,
            { accountId: $(ddlsource).val() },
            function(data) {
                var items = '';
                $("#meters").empty();
                $.each(data,
                    function(i, meter) {
                        items += "<option value='" + meter.value + "'>" + meter.text + "</option>";
                    });
                $('#meters').html(items);
            });
    });

});

单步执行代码，我注意到在'var url ='@ Url.Content（“〜/”）'+“ GetMeters”;'之后执行后，“ URL”设置为“ @ Url.Content（“〜/”）GetMeters“。

正在查看StackOverflow上的类似问题，因此我尝试仅使用“〜/ GetMeters”，但这也不起作用。

如果url设置为'https://localhost:44344/Meters/GetMeters'，则将正确调用控制器上的函数。解决此问题的最佳方法是什么？谢谢！

Answer 1

render_command是Razor插值指令，并且将仅在Razor视图或页面文件（@Url.Content）中进行解析。 Razor视图引擎没有其他功能，因此不能期望它在CSHTML文件以外的任何文件中都可以工作。

有几种方法可以在页面加载时将服务器端数据传递给JavaScript文件-超出StackOverflow答案中的范围。对于您的特定情况，似乎只需要将URL根传递给脚本，以便它可以调用终结点。通常最好是在服务器端完全呈现操作URL，而不是在客户端构建它们。为此，可以使用以下方法之一。

1。从引用此文件的视图中提供一个全局变量

SomeView.cshtml

.cshtml

somescript.js

<script>
window.Routes = {
    getMeters: '@Url.Action("GetMeters", "Meters")', // the GetMeters action on MetersController
    // add other routes here
};
</script>

<script src="@Url.Content("~/somescript.js")"></script>

2。让脚本公开一个函数并从视图中调用它

somescript.js

$(document).ready(function() {
    var url = Routes.getMeters;
    // ...
});

SomeView.cshtml

// This function replaces $(document).ready(...)
function initialize(getMetersRoute) {
    var url = getMetersRoute;
    // ...
}

Answer 2

一种解决方案是在一个布局cshtml文件中创建一个包含您的URL的变量，该变量将在您使用JavaScript文件的任何地方使用，然后您只需在JS文件中调用此变量即可。

示例：

websiteUrl = '@Url.Content("~/")';

您只需要使用websiteUrl。

@ Url.Content（“〜/”）在JavaScript文件中不起作用？

2 个答案:

1。从引用此文件的视图中提供一个全局变量

2。让脚本公开一个函数并从视图中调用它