CODEWITHSUNDEEP
htmlangularjs
user3483782
user3483782

Reputation: 61

ng-if for comparing dynamic json values

I am new to AngularJs I have two JSON objects one is "products" and and another is "users" I have two ng-repeat one is for product display and inside that to get user name of product i have another loop. In the inner loop I need to check userId from product JSON and compare it with userId in User object and if matches display it in P tag. My code is as follows:

<div class="col-md-4" ng-repeat="(key,value) in products" style="padding-top: 1.4%; padding-bottom: 1.4%;" >
<img style="height:300px;width:350px" ng-src="{{products[key].image}}"></img>
<div ng-repeat="(userkey,value) in User">
<p ng-if="User[userkey].userId == products[key].user">{{{User[userkey].name}}</p> 
</div>
</div>

I have tried like this but it is displaying all users in p tag. Can anyone please help with this

Upvotes: 0

Views: 1322

Answers (3)

daniel
daniel

Reputation: 1162

You could do that with filter: 

 oneUser in User | filter: {userId:product.user}:true

fiddle

EDIT

The way you should do that is with filters, you could use ng-show/ng-hide but you are still rendering that item as a comment, while with filter it will not. So use this for large data.

Upvotes: 1

Dwijen
Dwijen

Reputation: 590

This is what worked for me - 

<div ng-repeat="p in products">
    <div ng-repeat="u in users">
        <p ng-show="u.userId == p.user">
            {{u.name}}
        </p> 
    </div>
</div>

Fiddle - http://jsfiddle.net/halirgb/Lvc0u55v/

Upvotes: 0

Nikhilesh K V
Nikhilesh K V

Reputation: 1480

<div class="col-md-4" ng-repeat="product in products" style="padding-top: 1.4%; padding-bottom: 1.4%;" >
<img style="height:300px;width:350px" ng-src="{{product.image}}"></img>
<div ng-repeat="(oneUser in User">
<p ng-show="oneUser.userId == product.user">{{{oneUser.name}}</p> 
</div>
</div>

Upvotes: 0

Related Questions