angular forEach not working with in ng-if function

Question

angular forEach not working with ng-if function but working using simple if Please check fiddle

angular.module('app5', []).controller('ctrl', function($scope) {
$scope.z = [ { name: 'aa', id: 55, picture: [1,4,3] } ];
$scope.display = function(x) {
    angular.forEach(x.picture, function(val,key){
        console.log(val);
        if (val === 4) {
            console.log("true");
            return true;
        } else {
            console.log("false");
            return false;
       }
    });
  };
});

dfsq · Accepted Answer · 2015-10-28 11:31:37Z

1

It's not ngIf, it's your method that doesn't return true (it returns undefined which is falsy value). You need to understand that returning from forEach doesn't propagate outside as function return. In your case, you can use convenient Array.prototype.some method:

$scope.display = function(x) {
    return x.picture.some(function(val, key) {
        return val === 4;
    });
};

Demo: https://jsfiddle.net/hzdyhx4n/2/

answered Oct 28, 2015 at 11:31

dfsq

193k26 gold badges244 silver badges261 bronze badges

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

Comments

user902383 · Accepted Answer · 2015-10-28 11:29:21Z

0

your $scope.display method returns undefined, and ng-if evaluates undefined to false, hence nothing is displayd

answered Oct 28, 2015 at 11:29

user902383

8,6508 gold badges47 silver badges66 bronze badges

Comments

uksz · Accepted Answer · 2015-10-28 11:33:20Z

0

Try using this scheme:

    angular.module('app', [])
    .controller('ctrl', function($scope) {
        $scope.z = [1,2,3];
        $scope.display = function(x) {
         return x(function(val, key) {
            return val === 1;
         });
        };
    });

    <div ng-app="app" ng-controller='ctrl'>
       <div ng-repeat=" x in z"> 
           <div ng-if="display(x)" >  
               display this
           </div>
       </div>
    </div>

edited Oct 28, 2015 at 11:33

answered Oct 28, 2015 at 11:28

uksz

18.4k31 gold badges102 silver badges172 bronze badges

1 Comment

Sachin Jain Over a year ago

i can't use this actually i made a simple example but in my application i need to first use foreach to check an id then use return

Prabhu S · Accepted Answer · 2015-10-28 12:09:59Z

0

bro try this code.. it's works

    <div ng-app="app5" >
<div ng-controller='ctrl'> 
    <div ng-repeat=" x in z" >  
        <png-if="display(x)" >display this<p>
    </div>
</div>
</div>

and

angular.module('app5', [])
.controller('ctrl', function($scope) {
    $scope.z = [ { name: 'aa', id: 20, picture: [,1,2,4,3] } ];
      $scope.display = function(x) {
        angular.forEach(x.picture, function(val,key){
            console.log(val);
            if (val === 4) {
                alert("ho");
                console.log("true");
                return true;
            } else {
                console.log("false");
                return false;
           }
        });
    };
});

answered Oct 28, 2015 at 12:09

Prabhu S

531 gold badge1 silver badge9 bronze badges

2 Comments

Prabhu S Over a year ago

<p ng-if="display(x)"> display this </p>

Prabhu S Over a year ago

actually it returns false,true and it continuous based upon values..we need to break if return true..

Collectives™ on Stack Overflow

angular forEach not working with in ng-if function

4 Answers 4

Comments

Comments

1 Comment

2 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

4 Answers 4

Comments

Comments

1 Comment

2 Comments

Your Answer

Sign up or log in

Post as a guest

Related