Sven Budak Sven Budak - 3 months ago 10x
JSON Question

If no Avatar, check gender from json and place in img tag

I build a app (its my first app) and there i give user the option to upload there user avatar and setup there genders. if (in this case a girl) dont upload any avatar, then i want to check the json and get the gender information, with this gender information i want to place the url to the female default avatar.

Here is my Controller Code:

$scope.getUserImage = function (user) {
if (user.avatar) {
return user.avatar;
} else {
return '/images/icons/user-' + user.gender + '.svg';

$scope.schueler = [
firstName: 'Sven',
lastName: 'Wauback',
gender: 'male',
avatar: 'url to avatar',
notice: 'Fast fertig mit Theorie'
firstName: 'Sonja',
lastName: 'Flockenbarsch',
gender: 'female',
avatar: 'url to avatar',
notice: 'Brauch Praxis Extrastunden'
firstName: 'Lisa',
lastName: 'Weber',
gender: 'female',
avatar: '',
notice: 'Hat kein bock auf Fotoabgabe'
firstName: 'Manuel',
lastName: 'Bürstenkrieger',
gender: 'male',
avatar: 'url to avatar',
notice: 'Denkt er wär der coolste'

And here the View File:

<md-list-item ng-repeat="item in schueler" class="md-2-line" ng-click="null">
<img ng-src="getUserImage(user)" class="md-avatar" alt="{{item.firstName}} {{item.lastName}}"/>
<div class="md-list-item-text" layout="column">
<h3>{{item.firstName}} {{item.lastName}}</h3>

Ok the function at top is a first try from me.. but this dont work. i dont know much javascript. i think this snipped is complete wrong. Can anyone tell me how is the correct way to do this?


It looks to me like you're passing in the wrong value for your image source. Shouldn't it be getUserImage(item) instead of getUserImage(user)

Edit: To get the value out it would be ng-src="{{getUserImage(item)}}"