时间戳

首页 > 解决方案 > 在MVC中的javascript中嵌套foreach

c# - 在MVC中的javascript中嵌套foreach

问题描述

我正在创建一个 ASP.NET MVC 应用程序，在其中显示带有数据库坐标的谷歌地图。我是这方面的新手，我遇到了嵌套 foreach 循环的问题......在 C# Razor 页面上，我有一个 JavaScript 函数“Initialize”，我在其中循环遍历包含坐标的对象数组并创建折线基于它们，然后将其添加到地图中。这工作正常，代码如下所示：

var latLongCoordinates =
[
    @foreach(var itemFlightState in Model.QARFlights[0].FlightStates)
    {
        <text> new google.maps.LatLng(@itemFlightState.PresentPosLatDec.ToString().Replace(",", "."), 
               @itemFlightState.PresentPosLongDec.ToString().Replace(",", ".")),</text>
    }
];

var flightPath = new google.maps.Polyline({
    path: latLongCoordinates,
    geodesic: true,
    strokeColor: '#FF0000',
    strokeOpacity: 1.0,
    strokeWeight: 2
});

flightPath.setMap(map);

但是，我需要显示几条不同的折线（每个航班一条），因此需要使用嵌套的 foreach 循环来实现这一点，但它不起作用。我想用另一个 foreach 循环围绕上面的示例来绘制所有航班，而不仅仅是上面示例中索引为 0 的航班。以下是我想做的事情：

@foreach (var itemQARFlight in Model.QARFlights) {
    var latLongCoordinates =
    [
        @foreach(var itemFlightState in itemQARFlight.FlightStates)
        {
            <text> new google.maps.LatLng(@itemFlightState.PresentPosLatDec.ToString().Replace(",", "."), 
                   @itemFlightState.PresentPosLongDec.ToString().Replace(",", ".")),</text>
        }
    ];

    var flightPath = new google.maps.Polyline({
        path: latLongCoordinates,
        geodesic: true,
        strokeColor: '#FF0000',
        strokeOpacity: 1.0,
        strokeWeight: 2
    });

    flightPath.setMap(map);
}

当添加周围的@foreach 时，下面的所有内容都会变为红色，并且解析器似乎不再理解我的意思了。

抱歉，如果这是一个微不足道的问题，但我真的无法解决它。任何帮助将不胜感激！最好的问候乌尔丽卡

标签： c#asp.net-mvcrazorforeachnested

解决方案

请注意，这@foreach会将您带回到 C#，因此您需要再次将 JavaScript 包装在<text>.

@foreach (var itemQARFlight in Model.QARFlights) {
    <text>
        var latLongCoordinates =
        ...
        flightPath.setMap(map);
    </text>
}

推荐阅读