it-swarm.com.de

Razor MVC Javascript-Array mit Modell-Array füllen

Ich versuche, ein JavaScript-Array mit einem Array aus meinem Modell zu laden. Es scheint mir, dass dies möglich sein sollte.

Keine der folgenden Möglichkeiten funktioniert.

Es kann keine JavaScript-Schleife erstellt und mit der JavaScript-Variablen durch das Model Array inkrementiert werden

        for(var j=0; j<255; j++)
        {
            jsArray = (@(Model.data[j])));
        }

Razor-Schleife kann nicht erstellt werden, JavaScript ist außerhalb des Gültigkeitsbereichs

        @foreach(var d in Model.data)
        {
            jsArray = d;
        }

Ich kann es schaffen, damit zu arbeiten

        var jsdata = @Html.Raw(Json.Encode(Model.data)); 

Aber ich weiß nicht, warum ich JSON verwenden sollte. 

Auch im Moment beschränke ich mich auf 255 Bytes. In Zukunft könnte es viele MBs geben.

75
Tom Martin

Dies ist möglich, Sie müssen nur die Rasierer-Sammlung durchlaufen

<script type="text/javascript">

    var myArray = [];

    @foreach (var d in Model.data)
    {
        @:myArray.Push("@d");
    }

    alert(myArray);

</script>

Hoffe das hilft

162
heymega

JSON-Syntax ist so ziemlich die JavaScript-Syntax für die Codierung Ihres Objekts . Daher ist Ihre Antwort in Bezug auf Prägnanz und Schnelligkeit die beste Wahl. 

Ich verwende diesen Ansatz, wenn ich Dropdown-Listen in meinem KnockoutJS-Modell fülle . Z.B. 

var desktopGrpViewModel = {
    availableComputeOfferings: ko.observableArray(@Html.Raw(JsonConvert.SerializeObject(ViewBag.ComputeOfferings))),
    desktopGrpComputeOfferingSelected: ko.observable(),
};
ko.applyBindings(desktopGrpViewModel);

...

<select name="ComputeOffering" class="form-control valid" id="ComputeOffering" data-val="true" 
data-bind="options: availableComputeOffering,
           optionsText: 'Name',
           optionsValue: 'Id',
           value: desktopGrpComputeOfferingSelect,
           optionsCaption: 'Choose...'">
</select>

Beachten Sie, dass ich Json.NET NuGet-Paket für die Serialisierung und das ViewBag zum Übergeben von Daten verwende.

7
Donal Lafferty

Ich arbeitete mit einer Liste von Toasts (Warnmeldungen), List<Alert> aus C #, und benötigte sie als JavaScript-Array für Toastr in einer Teilansicht (.cshtml-Datei). Der folgende JavaScript-Code hat bei mir funktioniert:

var toasts = @Html.Raw(Newtonsoft.Json.JsonConvert.SerializeObject(alerts));
toasts.forEach(function (entry) {
    var command = entry.AlertStyle;
    var message = entry.Message;
    if (command === "danger") { command = "error"; }
    toastr[command](message);
});
4
Soma Mbadiwe

Ich baute einen Schieberegler ein und musste alle Dateien im Ordner abrufen und hatte die gleiche Situation wie das C # -Array mit dem Javascript-Array. Diese Lösung von @heymega funktionierte perfekt, außer dass mein JavaScript-Parser auf var in foreach-Schleife gestört war. Also habe ich ein bisschen gearbeitet, um die Schleife zu vermeiden.

var allowedExtensions = new string[] { ".jpg", ".jpeg", ".bmp", ".png", ".gif" };

var bannerImages = string.Join(",", Directory.GetFiles(Path.Combine(System.Web.Hosting.HostingEnvironment.ApplicationPhysicalPath, "Images", "banners"), "*.*", SearchOption.TopDirectoryOnly)
    .Where(d => allowedExtensions.Contains(Path.GetExtension(d).ToLower()))
    .Select(d => string.Format("'{0}'", Path.GetFileName(d)))
    .ToArray());

Und der Javascript-Code lautet

var imagesArray = new Array(@Html.Raw(bannerImages));

Ich hoffe es hilft

4
Ali Umair

Zum Erweitern der am besten bewerteten Antwort als Referenz, wenn Sie dem Array komplexere Elemente hinzufügen möchten:

@:myArray.Push(ClassMember1: "@d.ClassMember1", ClassMember2: "@d.ClassMember2");

usw.

Wenn Sie das Array als Parameter an Ihren Controller übergeben möchten, können Sie es außerdem als String festlegen:

myArray = JSON.stringify({ 'myArray': myArray });

2
mcfroob

Dies wäre ein besserer Ansatz als ich implementiert habe :)

@model ObjectUser
@using System.Web.Script.Serialization
@{ 
    var javaScriptSearilizer = new JavaScriptSerializer();
    var searializedObject = javaScriptSearilizer.Serialize(Model);
 }

<script>
    var searializedObject = @Html.Raw(searializedObject )
    console.log(searializedObject);
    alert(searializedObject);
</script>

Hoffen Sie, dass dies Ihnen helfen wird, Sie daran zu hindern, das Modell zu durchlaufen (glückliche Codierung)

0
Muhammad Essa

Wenn es sich um ein symmetrisches (rechteckiges) Array handelt, probieren Sie Versuchen Sie es in ein Javascript-Array mit einer einzigen Dimension. Verwenden Sie einen Rasierer, um die Array-Struktur zu bestimmen. und dann in ein zweidimensionales Array umwandeln.

// this just sticks them all in a one dimension array of rows * cols
var myArray = new Array();
@foreach (var d in Model.ResultArray)
{
    @:myArray.Push("@d");
}

var MyA = new Array();

var rows = @Model.ResultArray.GetLength(0);
var cols = @Model.ResultArray.GetLength(1);

// now convert the single dimension array to 2 dimensions
var NewRow;
var myArrayPointer = 0;

for (rr = 0; rr < rows; rr++)
{
  NewRow = new Array();
  for ( cc = 0; cc < cols; cc++)
  {
    NewRow.Push(myArray[myArrayPointer]);
    myArrayPointer++;
  }
  MyA.Push(NewRow);
}
0
John Arundell