2017-04-19 38 views
0

我有一个要求,动态生成多个下拉列表,取决于从MongoDB收集的数据。动态ng模型生成多个下拉列表

{ 
    "_id" : ObjectId("58f4fdd4c9fc145b279a1cc9"), 
    "_class" : "com.zwayam.common.rg.mongodb.MasterDataFields", 
    "entityType" : "Company", 
    "editableFields" : { 
     "industry" : "mappingFields.industry", 
     "group" : "mappingFields.group" 
    } 
} 

在上述JSON对象产业是指列名称在表中和mappingFields.industry是指其值是从主列表即到来。

{ 
    "_id" : ObjectId("58edd50e44ae5483c2eb2f34"), 
    "_class" : "zwayam.common.rg.mongodb.MasterDataMap", 
    "fieldName" : "masterData", 
    "mappingFields" : { 
     "function" : [ 
      "Chartered Accountant/CPA", 
      "Chartered Accountant", 
      "Accounting", 
      "Tax", 
      "Company Secretary", 
      "Audit", 
      "Direct Sales Agent/Insurance Agents", 
      "Hotel/Restaurant", 
      "Content/Editors/Journalists", 
      "Finance", 
      "Consulting/Strategy/Corporate Planning" 
     ], 
     "industry" : [ 
      "Biotechnology/Pharmaceutical/Medicine", 
      "CRM/CallCentres/BPO/ITES/MedTrans", 
      "Educational/Training", 
      "Recruitment/Placement Agencies", 
      "Engineering/Projects", 
      "Entertainment/Media", 
      "Financial Services/Stockbroking" 
     ], 
     "group" : [ 
      "group 1", 
      "group 2", 
      "group 3", 
      "group 4", 
      "group 5", 
      "group 6", 
      "group 7" 
     ], 
     "scale" : [ 
      "scale 1", 
      "scale 2", 
      "scale 3", 
      "scale 4", 
      "scale 5", 
      "scale 6", 
      "scale 7" 
     ], 
     "type" : [ 
      "type 1", 
      "type 2", 
      "type 3", 
      "type 4", 
      "type 5", 
      "type 6", 
      "type 7" 
     ] 
    } 
} 

我能够填充列表,我已经做到了,从下面的代码

 <div class="col-sm-12 ats-display editCompany" 
      ng-repeat="(key,value) in dataList"> 
      <label for="workflowDefination" 
       class="control-label workflowLabel"> 
       {{key}} 
      </label> 
      <select ng-model="CompanyFields.value" ng-click="getfield();" 
       id="{{key}}" class="form-control" 
       ng-options="CompanyFields for CompanyFields in dataValueList.{{value}}" > 
       <option value="" label="Select the value"></option> 
      </select> 
      {{CompanyFields}} 
      <div class="col-sm-12" style="height: 17px;"></div> 
     </div> 

但我不知道如何设置NG-模型这些下拉菜单,并获得价值由用户从每个下拉菜单中选择。任何人都可以告诉我如何为上述要求设置动态ng模型吗?

回答

0

我通过设置ng-model ="CompanyObj[key]"其中CompanyObj是一个JSON对象

<div class="col-sm-12 ats-display editCompany" ng-repeat="(key,value) in dataList"> 
    <label for="workflowDefination" class="control-label workflowLabel">{{key}}</label> 
    <select ng-model="CompanyObj[key]" ng-click="getfield(CompanyFields[value]);" id="{{key}}" class="form-control" ng-options="CompanyFields for CompanyFields in dataValueList.{{value}}"> 
     <option value="" label="Select the value"></option> 
    </select> 
    {{CompanyFields}} 
    <div class="col-sm-12" style="height: 17px;"> 

    </div> 

</div> 
0

我们可以使用$eval解析对象中表达解决我的问题。 Plunker

JS:

<div ng-repeat = "(key,value) in parentdata.editableFields" > 
     {{key}} 
    <select id="{{key}}" ng-model="selectedQuery" ng-options="key as value for (key,value) in $eval('jsondata.'+value)"> 
       <option value="" label="Select the value"></option> 
    </select> 
    </div> 
相关问题