Display the JSON information into a drop down.Angularjs

Question

This is my JSON data:

{
    result: 1,
    vote_time_slots: {
    2016-08-07: {
        diff: 1080,
        slots: {
            08:42: false, 09:36: false, 06:54: false, 04:30: false,
            09:18: false, 09:00: false, 08:24: false, 05:42: false,
            06:00: false, 10:12: false, 08:06: false, 06:36: false,
            07:12: false, 07:48: false, 05:24: false, 06:18: false,
            09:54: false, 07:30: false, 10:30: false, 05:06: false,
            04:48: false
        }
    },
    2016-07-25: {
        diff: 1080,
        slots: {
            08:42: false,
            09:36: false,
            06:54: false,
        }
    },

I want the time slots like 08:42, 09:36 and so on to be getting into a drop down.

please tell me how to navigate to slots field and get only slot values Filtered on false (which is value)

<li ng-repeat="c in eventTimings | filter: ????:false"><a>{{(c)}}

how to show based on filter also?

If i have true value the respective time slot should not show in drop down.

Please give more information about your json data. What do you mean by navigating ? — ngrj
– ngrj, Commented Jul 20, 2016 at 9:50
navigating means i need to go to the slots object to get the information from it First from vote_time_slots-->2016-08-07-->slot--->get necessary info — user1851003
– user1851003, Commented Jul 20, 2016 at 10:11
You can use "." to access object properties or you can "navigate" by accessing the properties just like accessing array elements. For your case, vote_time_slots.2016-08-07.slots — ngrj
– ngrj, Commented Jul 20, 2016 at 10:42

Peheje · Accepted Answer · 2016-07-20 08:51:02Z

1

Try like this:

slots = {
            "08:42": false, "09:36": false, "06:54": false, "04:30": false,
            "09:18": false, "09:00": false, "08:24": false, "05:42": false,
            "06:00": false, "10:12": false, "08:06": false, "06:36": false,
            "07:12": false, "07:48": false, "05:24": false, "06:18": false,
            "09:54": false, "07:30": false, "10:30": false, "05:06": false,
            "04:48": false
        };
var arr = [];
for(var prop in slots) { arr.push(prop); }
console.log(arr);

From here on you repeat on the arr

ng-repeat="opt in arr" ...

answered Jul 20, 2016 at 8:51

Peheje

14.5k1 gold badge25 silver badges31 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

Community · Accepted Answer · 2017-05-23 11:52:52Z

0

You will have to iterate over the properties of slots (since it is in object format). Please do search in stackoverflow before asking a question.

See if the answer in following link helps and write a custom filter using the logic:

Iterate through object properties

edited May 23, 2017 at 11:52

CommunityBot

11 silver badge

answered Jul 20, 2016 at 8:42

ngrj

3171 gold badge3 silver badges13 bronze badges

1 Comment

user1851003 Over a year ago

please tell me how to navigate to slots in my JSON to get information from it

Slava Utesinov · Accepted Answer · 2016-07-20 09:20:07Z

0

You can try this simple solution:

<li ng-repeat="(key, value) in data.slots" ng-if='!value'>{{key}}</li>

Another approach - to create custom filter:

HTML:

<li ng-repeat="(key, value) in data.slots | custom : false">{{key}}</li>

Javascript:

.filter('custom', function() {
  return function(input, search) {
    var result = {};
    angular.forEach(input, function(value, key) {
      if (value == search) {
        result[key] = value;
      }
    });
    return result;
}});

edited Jul 20, 2016 at 9:20

answered Jul 20, 2016 at 9:06

Slava Utesinov

13.5k2 gold badges22 silver badges26 bronze badges

3 Comments

user1851003 Over a year ago

please tell me how to navigate to slots in my JSON to get information from it

ngrj Over a year ago

This answer gives you a complete picture of what to do. I don't get your question, what do you mean by "navigate to slots"?

Slava Utesinov Over a year ago

@user1851003: For example: var data = yourJson['2016-08-07'];

Collectives™ on Stack Overflow

Display the JSON information into a drop down.Angularjs

3 Answers 3

Comments

1 Comment

3 Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

Comments

1 Comment

3 Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related