CODEWITHSUNDEEP
angularjsangularjs-directiveangularjs-scopeng-showng-hide
silvster27
silvster27

Reputation: 1936

Cannot get angular ng-show or ng-hide to work inside directive template

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;
            }
        };
    };
 });

Upvotes: 0

Views: 1288

Answers (1)

XrXr
XrXr

Reputation: 2057

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

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

Upvotes: 4

Related Questions