How to create new array from boolean object

Question

I'm pretty sure that there is something similar, but I can't figure it out this one in my scope. I have an array, and I need to create another array based on an object (In this case, BannerAtivo: true).

My JSON:

[{
    "BannerID": 0,
    "BannerImage": "http://hotsite/example2.png",
    "BannerMin": "http://hotsite/example.png",
    "BannerTitulo": "Xurupita Style",
    "BannerDesc": "Lorem Ipsum Dolor Siamet",
    "BannerAtivo": false,
    "SetorId": 1
}, {
    "BannerID": 2,
    "BannerImage": "http://hotsite/example2.jpg",
    "BannerMin": "http://hotsite/example.jpg",
    "BannerTitulo": "Chihuahua",
    "BannerDesc": "Role",
    "BannerAtivo": true,
    "SetorId": 1
}]

I'm trying the following code:

var data = response.data;
$scope.banners = data;
var a = $scope.banners;
function check(a) {
    return a.BannerAtivo = true;
    console.log(BannerAtivo);
}

What I want is: Show it in my scope only the lists where in the object BannerAtivo is true. I have already tried filter, and couldn't figure out how to make it. I can't even show it on the console. I know this question is dumb, and yes, I'm pretty newbie in javascript and angular. Sorry.

You are doing an assignment with = true not a comparison. Use == true or === true — Nope
– Nope, Commented Oct 10, 2017 at 15:58
@Fran I tried, but still, it doesn't show anything on the console. I'm pretty sure that I'm not getting the object right. — Andre Aquiles
– Andre Aquiles, Commented Oct 10, 2017 at 15:59
$scope.banners = response.data.filter((banner) => banner.BannerAtivo); — user5734311
– user5734311, Commented Oct 10, 2017 at 16:00
You console.log(BannerAtivo) doesn't execute, you are exiting the function before it with return. — Nope
– Nope, Commented Oct 10, 2017 at 16:01

user5734311 · Accepted Answer · 2017-10-10 18:00:32Z

1

If the JSON you posted ends up in response, then you need to run filter() on response, not response.data.

Here's working example code:

var response = [{
  "BannerID": 0,
  "BannerImage": "http://hotsite/example2.png",
  "BannerMin": "http://hotsite/example.png",
  "BannerTitulo": "Xurupita Style",
  "BannerDesc": "Lorem Ipsum Dolor Siamet",
  "BannerAtivo": false,
  "SetorId": 1
}, {
  "BannerID": 2,
  "BannerImage": "http://hotsite/example2.jpg",
  "BannerMin": "http://hotsite/example.jpg",
  "BannerTitulo": "Chihuahua",
  "BannerDesc": "Role",
  "BannerAtivo": true,
  "SetorId": 1
}];

$scope = {};
$scope.banners = response.filter(banner => banner.BannerAtivo);
console.log($scope.banners);

answered Oct 10, 2017 at 18:00

user5734311

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

1 Comment

Andre Aquiles Over a year ago

Hey @Chris G Just tried your solution and it almost worked. Sums up that I really needed to use the data. So the only thing I changed was using response.data.filter(~~); I'll give it to you the solution cuz it was the one that made me understand where I was making a mistake. Thanks for putting up the snippet, that really helped!

M0nst3R · Accepted Answer · 2017-10-10 16:12:57Z

1

You are actually assigning true to your variable in the check function instead of actually checking the value. Also, the console.log statement has no meaning after the return statement because it represents code that can never be reached.

Now to solve your problem, all you need to do is filter you array based on the boolean value as such :

$scope.banners = response.data.filter((value) => {
    return value.BannerAtivo;
});

answered Oct 10, 2017 at 16:12

M0nst3R

5,3131 gold badge28 silver badges39 bronze badges

4 Comments

Andre Aquiles Over a year ago

I tried but I didn't really work. Tried to put the return in my console to check it and wasn't getting no response. Harman's answer did the trick, but, just to learn a little bit more, how exactly this code should work? Btw, there is any better alternative to use this on Angular with directives?

M0nst3R Over a year ago

I am not sure how Harman's solution worked and not this one. This solution is the short version of his solution. Maybe it did not work because your response.data is empty or not the right array you need. On the other hand, I do not think there is a better way of doing this, the filter is great for what you need.

Andre Aquiles Over a year ago

Now I understood. Kinda slow learner but making progress (lmao). Your answer along with Chris snippet did the trick. Thanks for it!

M0nst3R Over a year ago

Absolutely, glad I could help.

Harman · Accepted Answer · 2017-10-10 18:25:57Z

1

Run this code and check in console the returned array of objects with only true values. Here you go:

    <html>
        <body>
             <script type="text/javascript">
             //Assuming you got response here
                 var data = [
                        {
                            "BannerID": 0,
                            "BannerImage": "http://hotsite/example2.png",
                            "BannerMin": "http://hotsite/example.png",
                            "BannerTitulo": "Xurupita Style",
                            "BannerDesc": "Lorem Ipsum Dolor Siamet",
                            "BannerAtivo": false,
                            "SetorId": 1
                        },
                        {
                            "BannerID": 2,
                            "BannerImage": "http://hotsite/example2.jpg",
                            "BannerMin": "http://hotsite/example.jpg",
                            "BannerTitulo": "Chihuahua",
                            "BannerDesc": "Role",
                            "BannerAtivo": true,
                            "SetorId": 1
                        },
                        {
                            "BannerID": 2,
                            "BannerImage": "http://hotsite/example2.jpg",
                            "BannerMin": "http://hotsite/example.jpg",
                            "BannerTitulo": "Chihuahua",
                            "BannerDesc": "Role",
                            "BannerAtivo": true,
                            "SetorId": 1
                        }
                    ];

                var returnTrueData = function () {
                var result = [];
                for (var i = 0; i < data.length; i++) { //looping through array of objects
                     for (key in data[i]) { //looping through each object

                          if(key === "BannerAtivo" && data[i][key] === true) { //If the key is "BannerAtivo" and it has value 'true'
                              result.push(data[i]); //push the whole object into the result array
                         }

                    }
                 }
                 console.dir(result);
                 return result;
              }


        returnTrueData();

    </script>
</body>

For your better understanding, see how to loop through objects or array of objects

edited Oct 10, 2017 at 18:25

answered Oct 10, 2017 at 16:17

Harman

2981 silver badge14 bronze badges

6 Comments

Andre Aquiles Over a year ago

That actually worked like a charm! Thank you! Really, thanks for spending your time with this to help me out! Could I ask you about where I can "learn" a little bit more about those kind of searchs in arrays? I was looking for it on w3c and wasn't getting much.

user5734311 Over a year ago

All this is already done by Array.filter()

Harman Over a year ago

@AndréSousa you're welcome! Please upvote and tick the answer if you think my effort was worth it :) We are always here to help each other learn :)

Harman Over a year ago

@AndréSousa about the learning part, I learnt mostly while working out problems, you can work on some exercises on Objects and arrays. Learning by doing is best.

Andre Aquiles Over a year ago

@Harman hello again! I just upvoted you (not sure who downvoted) but I'll give the answer to Chris because it is more suited to my code using angular. But for real, thanks again mate!

|

Collectives™ on Stack Overflow

How to create new array from boolean object

3 Answers 3

1 Comment

4 Comments

6 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

1 Comment

4 Comments

6 Comments

Your Answer

Sign up or log in

Post as a guest

Related