Javascript angularjs中选择选项的嵌套列表

对angularjs来说绝对是新鲜事

我有如下json对象

data =
[{ company : "companyA", headOffice : "cityA", industry :"software", transactionCurency : "USD" , otherAspect :{numberofEmployees : "10000", public : "yes", listed : "NYSE"}},

{ company : "companyB", headOffice : "cityA", industry :"software", transactionCurency : "USD" , otherAspect :{numberofEmployees : "20000", public : "no", listed : "NA"}},

{ company : "companyC", headOffice : "cityB", industry :"Oil", transactionCurency : "EUR" , otherAspect :{numberofEmployees : "150000", public : "yes", listed : "LSE"}},
{ company : "companyD", headOffice : "cityX", industry :"manufactoring", transactionCurency : "YEN" , otherAspect :{numberofEmployees : "30000", public : "yes", listed : "TSE"}
},

{ company : "companyE", headOffice : "cityB", industry :"Auto", transactionCurency : "EUR" , otherAspect :{numberofEmployees : "330000", public : "no", listed : "NA"}}];

我想在“otherAspect”内部列表的基础上创建下拉列表。。 如numberOfEmployees={3000030000100020000}，同样列出=“纽约证交所、北美证交所、伦敦证交所、东京证交所”

我曾尝试使用ng repeat，但它为每个对象创建了一个下拉列表，因此我有数百个下拉列表

正如我所说，我是这个论坛以及angularjs的新手，我不确定我需要提供什么信息。 谢谢

您可以通过以下方式完成此操作：

像这样试试

HTML:

<div ng-app="myApp">
<div ng-controller="MyCtrl">
<select ng-model="aspect" ng-options="d.otherAspect.listed for d in data">
</select>
<br/>Selected: {{aspect}}
</div>
</div>

 var myApp = angular.module('myApp', []);
 myApp.controller('MyCtrl', ['$scope', function($scope) {
 $scope.data = [{
  company: "companyA",
  headOffice: "cityA",
  industry: "software",
  transactionCurency: "USD",
  otherAspect: {
    numberofEmployees: "10000",
    public: "yes",
    listed: "NYSE"
  }
},

{
  company: "companyB",
  headOffice: "cityA",
  industry: "software",
  transactionCurency: "USD",
  otherAspect: {
    numberofEmployees: "20000",
    public: "no",
    listed: "NA"
  }
},

{
  company: "companyC",
  headOffice: "cityB",
  industry: "Oil",
  transactionCurency: "EUR",
  otherAspect: {
    numberofEmployees: "150000",
    public: "yes",
    listed: "LSE"
  }
}, {
  company: "companyD",
  headOffice: "cityX",
  industry: "manufactoring",
  transactionCurency: "YEN",
  otherAspect: {
    numberofEmployees: "30000",
    public: "yes",
    listed: "TSE"
  }
},

{
  company: "companyE",
  headOffice: "cityB",
  industry: "Auto",
  transactionCurency: "EUR",
  otherAspect: {
    numberofEmployees: "330000",
    public: "no",
    listed: "NA"
  }
}
];
}]);

 var myApp = angular.module('myApp', []);
 myApp.controller('MyCtrl', ['$scope', function($scope) {
 $scope.data = [{
  company: "companyA",
  headOffice: "cityA",
  industry: "software",
  transactionCurency: "USD",
  otherAspect: {
    numberofEmployees: "10000",
    public: "yes",
    listed: "NYSE"
  }
},

{
  company: "companyB",
  headOffice: "cityA",
  industry: "software",
  transactionCurency: "USD",
  otherAspect: {
    numberofEmployees: "20000",
    public: "no",
    listed: "NA"
  }
},

{
  company: "companyC",
  headOffice: "cityB",
  industry: "Oil",
  transactionCurency: "EUR",
  otherAspect: {
    numberofEmployees: "150000",
    public: "yes",
    listed: "LSE"
  }
}, {
  company: "companyD",
  headOffice: "cityX",
  industry: "manufactoring",
  transactionCurency: "YEN",
  otherAspect: {
    numberofEmployees: "30000",
    public: "yes",
    listed: "TSE"
  }
},

{
  company: "companyE",
  headOffice: "cityB",
  industry: "Auto",
  transactionCurency: "EUR",
  otherAspect: {
    numberofEmployees: "330000",
    public: "no",
    listed: "NA"
  }
}
];
}]);