angularjs ng-show无效

时间:2015-02-01 21:55:28

标签: angularjs angularjs-ng-show

Html代码:

<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代码:

    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'}
    ];


}]);

我试过ng-show =&#34; true&#34;和ng-show =&#34; false&#34;,我的代码按预期工作。

我在html页面上打印store.canPurchase值,值正确显示。

但是当我在ng-show中给store.canPurchase代码时,代码不起作用。

1 个答案:

答案 0 :(得分:2)

删除引号,它会正常工作。 canPurchase的错误和真实价值现在是字符串(&#34;&#34;)而不是布尔值。

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

Plunkr

同样适用于soldOut btw:)