Absolutely new to angularjs
I have json object as follows
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"}}];
I want to create drop downs on the basis of "otherAspect" inner list.. as numberOfEmployees ={3000,330000,1000, 20000}, listed ="NYSE,NA,LSE,TSE" likewise.
I have tried to use ng-repeat but for each object it created a drop down , therefore I had hundreds of drop down.
As I said I am new to this forum as well angularjs I am not sure what info I need to provide. Thanks
You can do this with ng-options
:
<select ng-model="aspect" ng-options="d.otherAspect.listed for d in data"></select>
Try like this
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>
Javascript:
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"
}
}
];
}]);
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.