Fehler beim Binden von komplexen Eingaben an Variable, effizient

Question

Ich bin neu in Angular und versuche zu lernen. Ich versuche einen Weg zu finden, um einige Mengen mit ihren IDs zu verbinden. Hier ist meine Vorlage:

"<div class='tableBorder'><label> <input ng-model='" + modelngQTY + "' type='number' name='{{value.DetailID}}' /> {{value.Text | lowercase}} </label> </div>" 

Die modelngQTY ist:

modelngQTY = "selectedOptions[value.CustomID].Details[value.DetailID].QTY"; 

Leider ist das Objekt, das mit diesem Code generiert wird ist:

{"36":{"Details":{"107":{"QTY":2323232},"108":{"QTY":232323}}}} 

ich es so aussehen soll:

{"36":{"Details":[{DetailID: "107", "QTY":2323232},{DetailID: "108","QTY":232323}]}} 

Hier ist ein Seite-an-Seite-Visualisierung der beiden. Ich möchte den einen auf der linken Seite:

Die Version auf der rechten Seite ist schrecklich schwer mit ng-repeat zu durchlaufen. Ich habe alle Daten offensichtlich ich kann einfach nicht herausfinden, wie man das Modell schreibt. Ich habe versucht, {} und [], sowie viele verschiedene ngmodel-Versionen. Das Beste, was ich bekommen konnte, war die Version auf der rechten Seite.

Ich habe schon viel gegoogelt und es gibt Unmengen von Ressourcen, wie man mit ng-Optionen filtert und spielt, aber ich konnte kaum etwas über das Einbetten der Daten in das Modell finden Format.

Was fehlt mir hier?

Answer 1

Eine mögliche Lösung dieses Problems bei http://plnkr.co/edit/9wMZAD?p=info existiert.

Diese Kartenfunktionen

vm.endingStructure= _.map(vm.beginningStructure, function(object, value) { 
    var newStructure = {}; 
    newStructure[value] = { 
     Details: _.map(object.Details, function(qtyObject, value) { 
     var arrayStructure = { 
      DetailID: value, 
      QTY:qtyObject.QTY 
     }; 
     return arrayStructure; 
     }) 
    }; 
    return newStructure; 
    }); 

dreht { "36": { "Details": { "107": { "QTY": 2323232 }, "108": { "QTY": 232323 } } } } in [ { "36": { "Details": [ { "DetailID": "107", "QTY": 2323232 }, { "DetailID": "108", "QTY": 232323 } ] } } ]

Answer 2

Sie Angenommen, haben einige $scope.values Array, das Sie iteriert werden über Sie dies tun können:

<div class='tableBorder'> 
    <label> 
     <input ng-model="selectedOptions[value.CustomID].Details[values.length].QTY" 
       type='number' name='{{value.DetailID}}' 
       ng-change="selectedOptions[value.CustomID].Details[values.length].DetailID = value.DetailID" 
       type='number' name='{{value.DetailID}}'> {{value.Text | lowercase}} 
    </label> 
</div> 

Im Grunde habe ich verwendet ng-change eine zweite Eigenschaft zu initiieren. Der Index basiert auf $scope.values und Sie verwenden . Dies ist, was erscheint. Wenn dies nicht der Fall ist, setzen Sie den Index anders.

CodePen: http://codepen.io/theblindprophet/pen/NArOwR

Referenz: Bind 2 models