2016-04-05 6 views
1

Ich versuche, zwei Probleme zu lösen (auch wenn einer von ihnen nicht wirklich ein Problem ist).Convert ng-Repeater Multi-Level-Werte

muss ich eine Zwei-Ebenen-Array von Objekten Trog laufen, die so ziemlich wie folgt aussieht:

{"id": "1","details": [{"name": "Name 1","surname": "Surname 1"}]}, 
{"id": "2","details": [{"name": "Name 2","surname": "Surname 2"}]}, 
{"id": "3","details": [{"name": "Name 3","surname": "Surname 3"}]}, 
{"id": "4","details": [{"name": "Name 4","surname": "Surname 4"}]} 

Ich brauche auch die gedruckte Wert zu konvertieren, die ID als Parameter verwendet:

$scope.convert = function (id){ 
    switch (id) { 
    case "1": 
     $scope.role = "role 1" 
    break; 
    case "2": 
     $scope.role = "role 2" 
    break; 
    case "3": 
     $scope.role = "role 3" 
    break; 
    case "4": 
     $scope.role = "role 4" 
    break; 
    } 
} 

Jetzt, im html, ist es das, was ich zur Zeit:

<h3>Works - with nested repeaters</h3> 
<ul ng-repeat="i in items" ng-click="convert('{{i.id}}')"> 
    <ul ng-repeat="a in i.details"> 
     {{a.name}} 
    </ul> 
</ul> 
<br/> 
{{role}} 

Und hier sind die Fragen:

  • Ich weiß, dass ng-repeat innerhalb eines anderen ng-repeat macht den Job, aber ich denke, das ist nicht der beste Weg ist, diese Art von Situation zu handhaben. Ich habe auch versucht ng-repeat-start/end, aber ich konnte nicht herausfinden, wie, wie ich immer einen Fehler sagte, dass Ende nicht gefunden wurde, auch wenn es da war.

  • Wenn ich auf den Namen klicke, um die Konvertierungsfunktion aufzurufen, funktioniert es, aber wenn ich versuche, die Funktion in den Repeater wie diese {{ convert ('{{a.id}}') }} aufzurufen, schlägt es fehl. Alles was ich brauche, um fair zu sein, ist, statt der ID die umgewandelte Zeichenkette direkt im Repeater anzeigen zu können (ich kann die json-Datei leider nicht ändern).

Hier ist, was ich oben beschrieben: http://codepen.io/anon/pen/YqXBqN?editors=1010

+0

i Ich denke, du verstehst zu '{{convert (a.id)}}' weil '{{convert (' {{a.id}} '}}}' * convert * mit ''{{a.id}}'' als String – kiro112

+0

in der Funktion, in der ich die ID tatsächlich verwende, aufruft eine Zeichenfolge und nicht als int – Nick

+0

BTW, sogar ändern, wie Sie gesagt haben, immer noch einen Fehler – Nick

Antwort

1

Syntaxfehler ng-click="convert('{{i.id}}')" sollte statt zur Vereinbarkeit eines role Variablenwert add attr zu ng-click="convert(i.id)"

umgewandelt werden, wie die id zu modellieren ist wichtig

$scope.addRole = function (model){ 
    var id = '' + model.id; 
    switch (id) { 
     case "1": 
      model.role = 'role 1'; 
      break; 
     case "2": 
      model.role = 'role 2'; 
      break; 
     case "3": 
      model.role = 'role 3'; 
      break; 
     case "4": 
      model.role = 'role 4'; 
      break; 
    } 
} 

html

<ul ng-repeat="i in items"> 
    {{addRole(i)}} 
    {{i.id}} - {{i.role}} 
</ul> 
2

Sie müssen wie als convert-Methode ändern -

$scope.convert = function (id){ 
    switch (id) { 
     case "1": 
     return "role 1" 
     break; 
     case "2": 
     return "role 2" 
     break; 
     case "3": 
     return "role 3" 
     break; 
     case "4": 
     return "role 4" 
     break; 
     } 

    } 

dann html aktualisieren as-

<ul ng-repeat="i in items" ng-click="convert('{{i.id}}')"> 
     <ul ng-repeat="a in i.details"> 
     {{i.id}} - {{a.name}}- {{convert(i.id)}} 

     </ul> 
    </ul> 

Seine Ausgabe wird

1- Name 1 -role 1 
2- Name 2 -role 2 
3- Name 3 -role 3 
4- Name 4 -role 4 
+0

Das funktioniert, danke. Was ist mit der anderen Frage? Verwenden Sie ng-repeat innerhalb einer anderen ng-Wiederholung? Irgendwelche Vorschläge, wie kann ich das auch verbessern? – Nick

+0

@Nick Ich werde es sehen und Sie wissen lassen, wenn ich irgendeine alternative Möglichkeit gefunden habe, solche Dinge zu tun. Vielen Dank –