Ng-show for avatar


#1

Hi,

I succesfull get a list of user and take your photo to make avatar in list.
I would set generic avatar if the user haven’t upload photo, but how is possible?


#2

You can have two divs: one containing the user photo and the other containing the generic avatar. Then you can do an ng-if to decide which one gets added to the html. This also depends on how you’re getting the user photo. Is the photo in a JSON object as a string?


#3

I’m getting the photo name by JSON string:

[{"user_id":"81","name":"Fedefico","photo":"0","distanza":"0.00"},{"user_id":"18","name":"fedenick","photo":"1_27427.jpg","distanza":"2.34"},{"user_id":"37","name":"ecos","photo":"","distanza":"2.53"}]

as you could see some user have the name of photo, others have 0 or empty value (it’s an old database)!

Now I write so:

<div class="list">
<a class="item item-avatar" href="#/app/showprof/{{result.user_id}}" ng-repeat="result in results track by $index">
<img ng-show="result.photo!=0" ng-src="http://www.digitalxp.it/public/speedjob/users/{{result.name}}/{{result.photo}}">
<img ng-if="result.photo=0" src="img/generic_avatar.png">
  <h2>{{result.name}}</h2>
  <p>{{result.distanza}} km</p>
  </a>
</div>

but no avatar is showen! If I remove

<img ng-if="result.photo=0" src="img/generic_avatar.png"> 

I see only image different from 0!


#4

You have a few problems with the above code. The 0 is a string and you are comparing it as an integer, the second comparison is an assignment not a compare, and you aren’t accounting for empty values.

I put together this codepen with your code to show you how to check for all of the above. Hope that helps!


#5

thank you so much this works for me! :wink:


#6

sorry, but I use your code to show if a message it’s send or receive and put in ng-repeat:

<span ng-if="messaggi.per = messaggi.user_id">from:</span>
<span ng-if="messaggi.per != messaggi.user_id">to:</span>

but with this results:

[{"user_id":"1","per":"1"},{"user_id":"1","per":"18"}]

it’s always show only “from:”!!!


#7

Using a single “=” results in an assignment. If you want to compare that two things are equal to each other you need to use two “==”. It will always show “from” because you are assigning user_id to per each time.


#8

But how could use ng-if into repeat element???


#9