0

A webservice returns values back... if the values returned are == 'N' I want to hide the html element. My problem is I cannot get ng-hide and ng-show to work inside the template. I looked at the other simular questions and the fixes didn't work for me. The confusing part is if I look at the rendered page the ng-show statement looks correct.

Here is my HTML:

<span five-star-img value="appHeader.star1"></span>
<span five-star-img value="appHeader.star2"></span>

Here is my directive:

angular.module('myApp')
.directive('fiveStarImg', function() {
    return {
       template: '<img ng-hide="{{showStar(value)}}"/>',
        restrict: 'A',
        replace: true,
        scope: {
            value: '=',
            isize: '@'
        };                  


        scope.showStar = function(value) {
            if (value == 'N') {
               return true;
            } else {
               return false;
            }
        };
    };
 });
silvster27
  • 1,916
  • 6
  • 30
  • 44

1 Answers1

4

You do not need the {{}} when using ng-hide or ng-show.

template: '<img ng-hide="showStar(value)"/>' should work just fine

XrXr
  • 2,027
  • 1
  • 14
  • 20