ng-Optionen mit einem komplexen multidimentional Array eines Objekts

Mein Objekt in controller.jsng-Optionen mit einem komplexen multidimentional Array eines Objekts

$scope.militaryObject = [ 
      { 
       label: "U.S. Air Force", 
       options: [ 
        {"name": "Active Duty", "value": "AF - Active Duty (AD)"}, 
        {"name": "Selective Reserve", "value": "AF - Selective Reserve (SR)"}, 
        {"name": "Spouse", "value": "AF - Spouse of AD or SR"}, 
        {"name": "Veteran", "value": "AF - Veteran"}, 
        {"name": "Civilian", "value": "AF - Civilian"}, 
        {"name": "Air National Guard", "value": "AF - Air National Guard"} 
       ] 
      },{ 
       label: "U.S. Army", 
       options: [ 
        {"name": "Active Duty", "value": "AR - Active Duty (AD)"}, 
        {"name": "Selective Reserve", "value": "AR - Selective Reserve (SR)"}, 
        {"name": "Spouse", "value": "AR - Spouse of AD or SR"}, 
        {"name": "Veteran", "value": "AR - Veteran"}, 
        {"name": "Civilian", "value": "AR - Civilian"}, 
        {"name": "Army National Guard", "value": "Army - Air National Guard"} 
       ] 
      },{ 
       label: "U.S. Coast Guard", 
       options: [ 
        {"name": "Active Duty", "value": "CG - Active Duty (AD)"}, 
        {"name": "Selective Reserve", "value": "CG - Selective Reserve (SR)"}, 
        {"name": "Spouse", "value": "CG - Spouse of AD or SR"}, 
        {"name": "Veteran", "value": "CG - Veteran"}, 
        {"name": "Civilian", "value": "CG - Civilian"} 
       ] 
      },{ 
       label: "U.S. Marine Corps", 
       options: [ 
        {"name": "Active Duty", "value": "MC - Active Duty (AD)", "selected" : "false"}, 
        {"name": "Selective Reserve", "value": "MC - Selective Reserve (SR)"}, 
        {"name": "Spouse", "value": "MC - Spouse of AD or SR"}, 
        {"name": "Veteran", "value": "MC - Veteran"}, 
        {"name": "Civilian", "value": "MC - Civilian"} 
       ] 
      },{ 
       label: "U.S. Navy", 
       options: [ 
        {"name": "Active Duty", "value": "NV - Active Duty (AD)"}, 
        {"name": "Selective Reserve", "value": "NV - Selective Reserve (SR)"}, 
        {"name": "Spouse", "value": "NV - Spouse of AD or SR"}, 
        {"name": "Veteran", "value": "NV - Veteran"}, 
        {"name": "Civilian", "value": "NV - Civilian"} 
       ] 
      },{ 
       label: "U.S. Department of Defense", 
       options: [ 
        {"name": "DoD Civilian", "value": "DoD - Civilian"} 
       ] 
      } 
     ];

Ich versuche, dieses Objekt in ausgewählte Verwendung ng-Option zu machen, hier ist mein Code in .html-Datei

<select ng-model="military" ng-options="value.options[key].name group by value.label for (key,value) in militaryObject"></select>

Das ist nicht für mich arbeiten, seine mir diese geben

<select ng-model="military" ng-options="value.options[key].name group by value.label for (key,value) in militaryObject" class="ng-valid ng-not-empty ng-dirty ng-valid-parse ng-touched"> 
    <optgroup label="U.S. Air Force"> 
     <option label="Active Duty" value="object:9">Active Duty</option> 
    </optgroup> 
    <optgroup label="U.S. Army"> 
     <option label="Selective Reserve" value="object:10">Selective Reserve</option> 
    </optgroup> 
    <optgroup label="U.S. Coast Guard"> 
     <option label="Spouse" value="object:11">Spouse</option> 
    </optgroup> 
    <optgroup label="U.S. Marine Corps"> 
     <option label="Veteran" value="object:12">Veteran</option> 
    </optgroup> 
    <optgroup label="U.S. Navy"> 
     <option label="Civilian" value="object:13">Civilian</option> 
    </optgroup> 
    <optgroup label="U.S. Department of Defense"> 
     <option label="undefined" value="object:14"></option> 
    </optgroup> 
</select>

Sein nicht alle Objekte in Optionen Array-Rendering. Bitte sagen Sie mir, was ich falsch mache Bitte helfen Sie !!! Vielen Dank im Voraus

Quelle

2016-09-16 Abdul Moiz

Sie verwenden ‚Gruppe‘ (Ich weiß nicht, diese Funktion) aber es scheint mir, es gruppiert Ihre Objekte, so dass nur eine pro Gruppe gerendert wird – user3791775

Kennen Sie eine alternative Möglichkeit, dies zu tun? Ich möchte nur das echte HTML gegen dieses Objekt rendern. –

Aber dann wäre es ein verschachteltes Dropdown oder so etwas: Sie haben Gruppen mit Elementen. Sie könnten die Gruppen durchlaufen und die Elemente zu einer neuen Liste hinzufügen. – user3791775

Dies ist, wie wir die Vorlage gegen diese komplexe Aufgabe machen kann, sein im Allgemeinen durch verschachtelte Verwendung ng-repeat

<select id="military" name="military" ng-model="military" ng-change="militaryChange()" style="color: #000;"> 
    <optgroup label="{{value.label}}" ng-repeat="(key,value) in militaryObject"> 
     <option value="{{v.value}}" ng-repeat="v in value.options">{{v.name}}</option> 
    </optgroup> 
</select>

Quelle

2016-09-17 01:13:03

Wenn jemand eine Idee haben, wie können wir es tun mit ng-change .. . bitte teilen.. –

ng-Optionen mit einem komplexen multidimentional Array eines Objekts

Antwort

Verwandte Themen