<script type="text/javascript">
window.onload = function () {
for (var i=0;i<@Model.listsinfo.Count;i++)
{
$('#work').append($('<div class="col-md-3" id="temp"><label for="text1">'+ '@Model.listsinfo[i].Label' +'</label></div><div class="col-md-3"> <input type="text" placeholder="Alerts" class="form-control" id="text1"> </div>'));
}
}
</script>
在上面的代码中,我从 Controller 传递一个列表并尝试迭代它。但是 @Model.listsinfo[i].Label 不起作用,并且错误表明“i”在当前上下文中不存在。我可以通过提供索引值 @Model.listsinfo[0].Label 来访问列表值,但迭代不起作用。如有任何帮助,我们将不胜感激。
最佳答案
您可以将 Json.Encode
与 Html.Raw
一起使用,并将其分配给 JavaScript 数组,然后从那里迭代内容:
<script type="text/javascript">
window.onload = function () {
var array = @Html.Raw(Json.Encode(@Model.listsinfo));
for (var i = 0; i < array.length; i++)
{
$('#work').append($('<div class="col-md-3" id="temp"><label for="text1">'+ array[i].Label +'</label></div><div class="col-md-3"> <input type="text" placeholder="Alerts" class="form-control" id="text1"> </div>'));
}
}
</script>
注意,Model.listinfo
在服务器端处理,迭代发生在客户端,所以需要先将viewmodel数组转换为JS数组,然后将其分配给append
方法。
类似问题:
关于javascript - 无法在 JavaScript 中迭代列表,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/46845995/