Angulajs数组中选择选项的嵌套循环

问题描述

嗨，我正在使用angularjs构建表单，我从PHP这样获得了一个数组返回值，我想从该数组构建出这样的表单。

<b>Company</b>
<select ng-model="attributs[]">
 <option>Chinese</option>
 <option>Japanese</option>
 </select>
 
 <b>Color</b>
<select ng-model="attributs[]">
 <option>Black</option>
 <option>Red</option>
 </select>

[
  {
      id: 1,name: "Company",attribute_values:[
        {
            id: 1,name: "Chinese"
        },{
            id: 2,name: "Japanese"
        }
    ]
  },{
      id: 2,name: "Color",attribute_values:[
        {
            id: 4,name: "Black"
        },{
            id: 5,name: "Red"
        }
    ]
  }
]

我想从选择选项中选择所有选择的值，但尝试不了。预先谢谢你。

<div ng-repeat="attrib in attributes.data">
  <label class="col-sm-5 col-form-label"><% attrib.name %></label>
   <div class="col-sm-5">                                       
     <select ng-model="attrib.attributeSelected" ng-options="atb.value as atb.name for atb in attrib.attribute_values">
    </select>
    </div>
 </div>

解决方法

您没有提到选择后想要的输出格式。我做了一个变通办法，它将在每个属性内创建一个属性selectedOption，以将所选选项的值保存在相应的属性中。

<div ng-repeat="attrib in data">
  <label class="col-sm-5 col-form-label">{{attrib.name}}</label>
   <div class="col-sm-5">                                       
     <select ng-model="attrib.selectedOption">
       <option default selected disabled value="">Select</option>
       <option ng-repeat="x in attrib.attribute_values" value={{x.id}}>{{x.name}}</option>
    </select>
    </div>
 </div>

将像下面这样插入属性selectedOption，

[{
    "id": 1,"name": "Company","attribute_values": [{
        "id": 1,"name": "Chinese"
    },{
        "id": 2,"name": "Japanese"
    }],"selectedOption": "1"
},{
    "id": 2,"name": "Color","attribute_values": [{
        "id": 4,"name": "Black"
    },{
        "id": 5,"name": "Red"
    }],"selectedOption": "5"
}]

angularjs multiple-select