Ngif not workin on img tag

ionic-v1
1

i want to hide the img tag when the “pic” property of the current ellement is empty but no way to get it work. i do this by checking if the property lenght is greater than 0.

html is

<div class="list card" ng-repeat="fonctionnement in fonctionnements "><div class="item item-divider"><strong>{{fonctionnement.name}}</strong></div>
  <div class="item item-body">
    <img ng-if='hasPicture("{{fonctionnement.pic}}")' class="full-image" src="img/{{fonctionnement.pic}}">
    <p>{{hasPicture("pop")}}
      {{fonctionnement.text}}
    </p>
  </div>
**The js is** 
.controller('InternetCtrl', function($scope,Fonctionnement) {
    $scope.fonctionnements=Fonctionnement.all();
    $scope.hasPicture = function(item){
        //return (item.length > 0) ;
        if(item.length > 0){
            return true
        }
        else return false
    }
})

here is the sevice code

.factory('Fonctionnement', function() {
    var items = [
        { id: 0, name:"XXX", pic: "pic.jpg", text: "...."},
        { id: 1, name:"XXXX", pic: "", text: "l'utilisateur qui ..."},
        { id: 2, name:"XXX", pic: "", text: "De l'autre côté...."},
    ];
    return {
        all: function() {
            return items;
        }
    }
})

thanks for your help

2

Try removing the curly braces from the call. Use hasPicture(fonctionnement.pic) instead of hasPicture("{{fonctionnement.pic}}")

3

thank you for your help i found a small fix. in my service i simply remove the pic property of an element if that element do not need it insead of a blank pic property

{ id: 2, name:"XXX", text: "De l'autre côté...."},

instead of

{ id: 2, name:"XXX", pic: "", text: "De l'autre côté...."},

i then simply make use of

<img ng-if="fonctionnement.pic" class="full-image" src="img/{{fonctionnement.pic}}">

instead of

<img ng-if='hasPicture("{{fonctionnement.pic}}")' class="full-image" src="img/{{fonctionnement.pic}}">

i do no more need for the hasPicture() method in my controller

hope this will also help.

thanks.

4

Because empty strings evaluate to false in javascript, you don’t even need to remove the pic property and it will still work.

5

Yes, tried it and it works great. This could prevent from eventual errors aswell.
Thanks ors