Razor 语法和 Javascript [英] Razor Syntax and Javascript

问题描述

作为测试，我将我们从 Web Forms 编写的概念验证应用程序转换为 Razor，以便我们对其进行评估.

As a test I'm converting a proof-of-concept app we've written from Web Forms to Razor, simply so we can evaluate it.

到目前为止，我遇到了一个让我头疼的问题..生成客户端 Javascript...

I've run into one problem so far that's making my head hurt..generating client-side Javascript...

<script type="text/javascript">
    var jqGridIdList = "<%: Url.Action ("getidlist", "office", new { area = "reports" }) %>";

    var availableIds = [];
    <% for (var i = 0; i < Model.Data.Count (); i++) { %>
    availableIds.push({ value : "<%: Model.Data.ElementAt (i).Text %>", label : "<%: Model.Data.ElementAt (i).Text %>" });
    <% } %>
</script>

Razor 语法

<script type="text/javascript">
    var jqGridIdList = "@Url.Action("getidlist", "office", new { area = "reports" })";

    var availableIds = [];
    @for(var i = 0; i < Model.Data.Count (); i++) {
    availableIds.push({ value : "@Model.Data.ElementAt(i).Text", label : "@Model.Data.ElementAt(i).Text" });
    }
</script>

编译器在availableIds.push"行给我以下错误:

The compiler gives me the following error on the 'availableIds.push' line:

编译器错误消息:CS1525:无效的表达式术语{"

Compiler Error Message: CS1525: Invalid expression term '{'

它显然试图将其编译为 C#...但我该如何阻止它?

It's obviously trying to compile it as C#...but how do I stop it?

谢谢，
基隆

推荐答案

需要将其包裹在伪元素中.这会将解析器切换回 html 模式，然后它将 javascript 解析为 html 而不是 c# 的一部分.它发生的原因是 @for() 是一个 c# 块，并且在其中处理的任何内容也被视为 c#，直到它被 html 标记转义.由于您可能不希望 html 标签 razor 提供 标签来切换模式.

You need to wrap it in the pseudo element <text>. This will switch the parser back to html mode and it will then parse the javascript as part of the html and not c#. The reason it happens is the @for() is a c# block and anything treated within is also considered c# until it's escaped by an html tag. Since you probably don't want an html tag razor provides the <text> tag to switch modes.

如果你注意到你的 asp.net webforms 的不同，你可以用 %> 结束 <% for 行，这会将它从 c# 模式中移除.如果您下载了 Visual Studio 2010 的 razor highlighter 扩展，它将帮助您了解何时将代码视为代码，何时将 html 视为 html.

If you notice the difference in your asp.net webforms you end the <% for line with a %> which takes it out of c# mode. If you download the razor highlighter extension for visual studio 2010 it will help you see when code is treated as code and html is treated as html.

<script type="text/javascript">
    var jqGridIdList = "@Url.Action("getidlist", "office", new { area = "reports" })";

    var availableIds = [];
    @for(var i = 0; i < Model.Data.Count (); i++) {
        <text>availableIds.push({ value : "@Model.Data.ElementAt(i).Text", label : "@Model.Data.ElementAt(i).Text" });</text>
    }
</script>

更新最新版本

您现在可以使用 @: 语法以获得更高的可读性

Update for latest version

You can now use the @: syntax for even more readability

<script type="text/javascript">
    var jqGridIdList = "@Url.Action("getidlist", "office", new { area = "reports" })";

    var availableIds = [];
    @for(var i = 0; i < Model.Data.Count (); i++) {
        @:availableIds.push({ value : "@Model.Data.ElementAt(i).Text", label : "@Model.Data.ElementAt(i).Text" });
    }
</script>

这篇关于Razor 语法和 Javascript的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！