CODEWITHSUNDEEP
angularjsangularjs-ng-show
user2748161
user2748161

Reputation: 89

angular js ng-show is not working

Html code:

<div ng-controller="StoreController">
                          <div ng-repeat="store in gems">

                                {{store.name}}<br>
                                {{store.price}}
                                {{store.canPurchase}}
                                {{store.soldOut}}
                                <button ng-show="store.canPurchase">Add to Cart</button>

                           </div>
                    </div>

JS code:

    myApp.controller('StoreController', ['$scope', function($scope){
    $scope.gems=[
            {name: 'Azurite', price: '110.50', canPurchase: 'false', soldOut: 'true'},
            {name: 'Azurite +', price: '120.50', canPurchase: 'true', soldOut: 'false'}
    ];


}]);

I tried with ng-show="true" and ng-show="false", my code is working as expected.

I am printing store.canPurchase value on my html page and values are displayed correctly.

But when I give store.canPurchase in ng-show the code doesn't work.

Upvotes: 1

Views: 446

Answers (1)

rmuller
rmuller

Reputation: 1837

remove the quotation marks and it will work fine. The false and true values of canPurchase are now strings ("") and not booleans.

$scope.gems=[
        {name: 'Azurite', price: '110.50', canPurchase: false, soldOut: true},
        {name: 'Azurite +', price: '120.50', canPurchase: true, soldOut: false}
];

Plunkr

The same goes for soldOut btw :)

Upvotes: 2

Related Questions