CODEWITHSUNDEEP
javascriptangularjsdropdown
jackD
jackD

Reputation: 801

How to add multiple values from different arrays into an dropdown?

I am trying to display data from an api into a dropdown (Department Full Name). I can display one value but not multiple values. Can you please tell me where am I going wrong?

From the json array I want to get values into select dropdown. The values I want to get into dropdown are shortName, semester and section. I can display only shortName but not other 2 values.

index.controller.js

   $http.get('https://student.herokuapp.com/department/')
        .success(function(response){

            $scope.deptDetails=response.department;
         //   console.log($scope.deptDetails);
            deptLen=response.department.sections.length;
            console.log(deptLen);

            for(var i=0;i<deptLen;i++){

                $scope.deptDetails.push({"_id":response.department._id,
                                                "shortName":response.department.shortName,
                                                "section":response.department.sections[i].section,
                                                "semester":response.department.sections[i].semester});
            }

        });

Json array

    {
 "department": {
"_id": "585955afce1a5e0011a2ecf5",
"collegeId": "58295efb836f8611d5e3e4cb",
"fullName": "Compcsuter Science",
"shortName": "CS",
"numberOfSemesters": "8",
"semesterYearScheme": "Semester",
"programName": "UG",
"numberOfSections": "1",
"sections": [
       {
   "_id": "585fb137bf29882207752552",
   "collegeId": "585e53c6729e5c2214b97a0f",
   "departmentId": "585fb137bf29882207752546",
   "semester": 4,
   "section": "C",
   "syllabus": [],
   "teachers": [],
   "students": [],
   "createdBy": "58332b90a7986c09b7e81980",
   "createdAt": "2016-12-25T11:44:55.445Z",
   "__v": 0
        }
    ]

Here is the plnkr

Upvotes: 0

Views: 53

Answers (1)

Sajeetharan
Sajeetharan

Reputation: 222592

You can do this,

app.controller("dobController", ["$scope", '$http',
      function($scope, $http) {
         $scope.displayValues = [];
         $http.get('test.json').then(function(response){
           $scope.data = response.data;
           console.log(response.data.department);
           $scope.displayValues.push(response.data.department.shortName);
            response.data.department.sections.forEach(function(key){
               $scope.displayValues.push(key.section);
               $scope.displayValues.push(key.semester);
            })

         });

      }
    ]);

EDIT

  response.data.department.sections.forEach(function(key){
           $scope.displayValues.push(response.data.department.shortName + " "+ key.section + " "+key.semester);

     })

DEMO

Upvotes: 2

Related Questions