@ Url.Content ("~ /") не работает в файле JavaScript?

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

@Url.Content - это директива интерполяции Razor, которая будет анализироваться только в представлении Razor или в файле страницы (.cshtml).Ничто другое не проходит через механизм представления Razor, поэтому нельзя ожидать, что он будет работать ни в одном файле, кроме файла CSHTML.

Существует несколько способов передачи данных на стороне сервера в файл JavaScript при загрузке страницы.-time - больше, чем можно было бы покрыть в ответе StackOverflow.В вашем конкретном случае кажется, что вам просто нужно передать корневой URL-адрес скрипту, чтобы он мог вызвать конечную точку.Обычно лучше полностью отобразить URL-адреса действий на стороне сервера, а не создавать их на стороне клиента, если это возможно.Для этого вы можете использовать один из следующих вариантов:

1.Предоставьте глобальную переменную из представления, которое ссылается на этот файл

SomeView.cshtml

<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>

somescript.js

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

2.Пусть скрипт выставит функцию и вызовет ее из представления

somescript.js

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

SomeView.cshtml

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

<script>
$(document).ready(function() {
    initialize('@Url.Action("GetMeters", "Meters")');
});
</script>

Answer 2

Одним из решений является создание переменной, содержащей ваш URL, в файле макета cshtml, который используется везде, где вы используете свой файл javascript, затем вы можете просто вызвать эту переменную в своем файле JS.

Пример:

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

Вам нужно только использовать websiteUrl.