在JavaScript中使用Razor

它是可能的，或有一个工作区，以使用Razor语法在JavaScript中，是在一个视图(cshtml)?

我正在尝试添加标记到谷歌地图…例如，我尝试了这个，但我得到了大量的编译错误:

<script type="text/javascript">

    // Some JavaScript code here to display map, etc.

    // Now add markers
    @foreach (var item in Model) {

        var markerlatLng = new google.maps.LatLng(@(Model.Latitude), @(Model.Longitude));
        var title = '@(Model.Title)';
        var description = '@(Model.Description)';
        var contentString = '<h3>' + title + '</h3>' + '<p>' + description + '</p>'

        var infowindow = new google.maps.InfoWindow({
            content: contentString
        });

        var marker = new google.maps.Marker({
            position: latLng,
            title: title,
            map: map,
            draggable: false
        });

        google.maps.event.addListener(marker, 'click', function () {
            infowindow.open(map, marker);
        });
    }
</script>

当前回答

有一件事要补充-我发现Razor语法分析器(可能是编译器)对开始括号的位置有不同的解释:

<script type="text/javascript">
    var somevar = new Array();

    @foreach (var item in items)
    {  // <----  placed on a separate line, NOT WORKING, HILIGHTS SYNTAX ERRORS
        <text>
        </text>
    }

    @foreach (var item in items) {  // <----  placed on the same line, WORKING !!!
        <text>
        </text>
    }
</script>

2011-05-31 10:12:28

其他回答

有一件事要补充-我发现Razor语法分析器(可能是编译器)对开始括号的位置有不同的解释:

<script type="text/javascript">
    var somevar = new Array();

    @foreach (var item in items)
    {  // <----  placed on a separate line, NOT WORKING, HILIGHTS SYNTAX ERRORS
        <text>
        </text>
    }

    @foreach (var item in items) {  // <----  placed on the same line, WORKING !!!
        <text>
        </text>
    }
</script>

2011-05-31 10:12:28

只要它在CSHTML页面中，而不是外部JavaScript文件中，就可以正常工作。

Razor模板引擎不关心输出什么，也不区分<script>或其他标记。

但是，您需要对字符串进行编码以防止XSS攻击。

2011-01-04 22:36:41

在我看来，下面的解决方案似乎比将JavaScript与Razor结合起来更准确。看看这个: https://github.com/brooklynDev/NGon

你可以向ViewBag中添加几乎任何复杂的数据。Ngon并在JavaScript中访问它

在控制器中:

public class HomeController : Controller
{
    public ActionResult Index()
    {
        var person = new Person { FirstName = "John", LastName = "Doe", Age = 30 };
        ViewBag.NGon.Person = person;
        return View();
    }
}

在JavaScript中:

<script type="text/javascript">
    $(function () {
        $("#button").click(function () {
            var person = ngon.Person;
            var div = $("#output");
            div.html('');
            div.append("FirstName: " + person.FirstName);
            div.append(", LastName: " + person.LastName);
            div.append(", Age: " + person.Age);
        });
    });
</script>

它允许使用默认的JavascriptSerializer序列化任何普通的旧CLR对象(POCOs)。

2015-04-09 15:18:59

我刚刚写了这个辅助函数。把它放在App_Code/JS.cshtml中:

@using System.Web.Script.Serialization
@helper Encode(object obj)
{
    @(new HtmlString(new JavaScriptSerializer().Serialize(obj)));
}

然后在你的例子中，你可以这样做:

var title = @JS.Encode(Model.Title);

注意我没有加引号。如果标题已经包含引号，它就不会爆炸。似乎处理字典和匿名对象也很好!

2011-11-07 01:10:12

你是想把方钉塞进圆洞里。

Razor的目的是作为一种html生成模板语言。您可以让它生成JavaScript代码，但它不是为此而设计的。

例如:What if Model。标题包含撇号?这将破坏JavaScript代码，默认情况下Razor不会正确转义它。

在辅助函数中使用String生成器可能更合适。这种做法可能会减少意想不到的后果。

2011-01-04 22:41:32

在JavaScript中使用Razor

推荐文章

最新文章

标签