Как встроить код Razor C # в файл .js? - PullRequest
12 голосов
/ 23 февраля 2012

Необходимо встроить блок кода JavaScript с

<script type='text/javascript'>
  ...
</script>

Но код Razor не будет компилироваться в файл .js, включенный из файла .cshtml.

Какэта работа?Или есть какой-нибудь другой элегантный способ получить подобный эффект?

Спасибо.

Ответы [ 6 ]

20 голосов
/ 23 февраля 2012

Когда я сталкиваюсь с этой проблемой, иногда я предоставляю функцию в файле .js, который доступен в файле .cshtml ...

// someFile.js
var myFunction = function(options){
    // do stuff with options
};

// razorFile.cshtml
<script>
    window.myFunction = new myFunction(@model.Stuff);
    // If you need a whole model serialized then use...
    window.myFunction = new myFunction(@Html.Raw(Json.Encode(model)));
</script>

Не обязательно ЛУЧШАЯ опция, но она подойдетесли вам нужно это сделать ...

Другая вещь, которую вы, возможно, можете попробовать - это использовать атрибуты данных в ваших HTML-элементах, например, как jQuery.validate.unobtrusive делает ...

//someFile.js
var options = $("#stuff").data('stuff');

// razorFile.cshtml
<input type="hidden" id="stuff" data-stuff="@model.Stuff" />
4 голосов
/ 05 мая 2016

Вот пример веб-страницы Razor (не в виде MVC, хотя это будет похоже), которая будет обслуживать Javascript.Конечно, нетипично динамически писать файлы Javascript, но, тем не менее, вот пример.Я использовал это один раз в случае, когда я хотел предоставить данные JSON и некоторые другие вещи, которые были дорогостоящими для вычисления и редко менялись - чтобы браузер мог включать их и кэшировать как обычный файл JS.Хитрость здесь в том, чтобы просто установить Response.ContentType, а затем использовать что-то вроде тегов Razor <text> для вашего Javascript.

@{
Response.ContentType = "text/javascript";
Response.Cache.SetLastModified(System.Diagnostics.Process.GetCurrentProcess().StartTime);
Response.Cache.SetExpires(System.DateTime.Now.Date.AddHours(28));
Response.Cache.SetCacheability(System.Web.HttpCacheability.Public);
<text>
var someJavaScriptData = @someSortOfObjectConvertedToJSON;
function something(whatever){
}
</text>
}

Затем вы можете включить его так же, как и в ваш другой файл Razor:

<script src="MyRazorJavascriptFile.cshtml"></script>
2 голосов
/ 23 февраля 2012

Вы не можете.Не стоит даже пытаться.Держите их отдельно.Это идет наоборот, но вы должны изучить ненавязчивый JavaScript .Этот шаблон проектирования, применяемый на протяжении всего проекта, является отличной идеей.

1 голос
/ 20 апреля 2013

Хотя я согласен с тем, что вам следует дважды подумать об использовании Razor в файлах Javascript, существует пакет Nuget, который может вам помочь.Она называется RazorJS .

Автор пакета содержит сообщение в блоге , в котором объясняется, как его использовать.

0 голосов
/ 12 января 2018

А как насчет включения .cshtml, который содержит только js?

.csthml parent

@RenderPage("_scripts.cshtml")

_scripts.cshtml, содержащий js

<script type="text/javascript">
alert('@Datetime.ToString()');
</script>
0 голосов
/ 09 августа 2013

Может быть, я могу предоставить полезный обходной путь, в зависимости от того, чего вы хотите достичь.

Я испытал искушение найти способ оценить выражения бритвы в файле сценария Java.Я хотел прикрепить обработчик события нажатия jQuery к отправкам с определенным классом, которые можно найти на многих страницах.Это должно быть сделано в обработчике событий, готовых для документа jQuery.Это событие щелчка будет выполнять вызов ajax.

URL-адрес должен быть относительным, а не абсолютным, если приложение живет ниже корневого уровня.Итак, я хотел использовать что-то вроде

$(document).ready(function () {
    $('input[type="submit"].checkit)').click(function (e) {
        $.ajax({
            type: 'POST',
            url: '@Url.Content("~/checkit")', //Razor expression here
            dataType: 'json',
            success: function (data) {
                if (!data) {
                    e.preventDefault();
                    handleResponse(data);
                }
            },
            data: null,
            async: false
        });
    });
});

Я решил это, обернув код в функцию Checkit и переместив вызов в представление макета:

        $(document).ready(function () {
            Checkit('@Url.Content("~/checkit")');
        });

Большинство JavaScriptкод все еще находится в файле JavaScript.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...