how to compare a stringvalue in ng-show inside a customdirective?

angularjs angularjs-directive angularjs-ng-repeat

67,715

Solution 1

The expression

ng-show="name.status_p1==working"

compares name.status_p1 with a working property on the current scope, which is not defined in your case. What you need is to compare it with the literal string 'working'.

ng-show="name.status_p1=='working'";

Modified Plunkr

Solution 2

In my case, I had this:

ng-show ="authenticated == {{it.logged_in_view}} || {{it.logged_in_view == 'neutral'}}"

and had to change it to this:

ng-show ='authenticated == {{it.logged_in_view}} || {{it.logged_in_view == "neutral"}}'

I enclosed the attribute string in single quotes and the string to be compared in double quotes.

67,715

Pindakaas

Smooth as peanutbutter but hard as chocolate.

Updated on July 11, 2022

Comments

Pindakaas almost 2 years

Trying to use a directive with an ng-show statement in it. Basically it checks against the value of a string which is the status_p1 property in my 'names' jsonarray:

ng-show="name.status_p1==working"

The directive is defined as this:

app.directive('radioButton',function(){
  return {
    restrict: 'E',

    replace: 'true',

    template: '<table border="2px">' +
    '<tr><td>{{name.name}}</td><td>Working</td><td><img src="http://www.iconshock.com/img_jpg/REALVISTA/general/jpg/256/cross_icon.jpg" alt="img1" id="imgworking" ng-show="name.status_p1!=working"><img src="http://png-1.findicons.com/files/icons/2198/dark_glass/128/camera_test.png" alt="img2" ng-show="name.status_p1==working"></td></tr>' +
    '</table>'
  };
})

The controller+ namesarray in my main page looks like this:

 app.controller('MainCtrl', function($scope) {
 $scope.names = [
    {
      name: 'couple 1',
      status_p1: 'working',
      status_p2: 'retired'
    }

  ]
});

And finally the main page:

<body ng-controller="MainCtrl">
    <div ng-repeat="name in names">
      <radio-button></radio-button>
    </div>
</body>

Currently is displays a cross where it should be displaying a check/tick. I was expecting the condition to evaluate to TRUE because the status_p1 property equals 'working'. How can I modify this ng-showstatement to make the string comparison working? plunkr link:http://plnkr.co/edit/3VdsbsSHpkNJFVnvkmOW?p=preview

c.P.u1 over 9 years

You'll need to escape the single quotes around \'working\' since your template string is delimited by single quotes. Check the modified plunkr.