Impossible d'itérer une liste en javascript

Question

<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> 

Dans le code ci-dessus, je transmets une liste de mon contrôleur et essaie de l'itérer. Mais @ Model.listsinfo [i] .Label ne fonctionne pas et l'erreur indique que 'i' n'existe pas dans le contexte actuel. Je suis en mesure d'accéder à la valeur de la liste en donnant les valeurs d'index @ Model.listsinfo [0] .Label mais les itérations ne fonctionnent pas. Toute aide est appréciée.

Answer 1

Vous pouvez utiliser Json.Encode avec Html.Raw et l'affecter à un tableau JavaScript, puis itérer le contenu à partir de là:

<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> 

Notez que Model.listinfo traitées au côté serveur et l'itération se produit en côté client, de sorte que vous Vous devez d'abord convertir le tableau viewmodel en tableau JS, puis l'affecter à la méthode append.

questions similaires:

MVC: Iterating a Viewbag array in javascript

jQuery: How to traverse/Iterate over a list of object