当我将对象 canPurchase 下的值设置为 true 时，应该显示添加到购物车按钮。出于某种原因，我只能在设置 ng-show 时在它前面加上感叹号才能显示它。 我对 Angular 还是陌生的，所以我不太了解术语。
这是我的 jsfiddle 链接:http://jsfiddle.net/jL0c6sLc/
<body class="container" ng-app="gemStore">
<div class="product row">
<h1>Store Name</h1>
</div>
<div ng-controller="StoreController as store">
<div class="product row" ng-repeat="product in store.products">
<h3>{{product.name}}<em class="pull-right">{{product.price | currency}}</em></h3>
<button ng-show="store.product.canPurchase">Add to Cart</button>
</div>
</div>
<script data-require="angular.js@1.2.10" data-semver="1.2.10" src="http://code.angularjs.org/1.2.10/angular.js"></script>
<script src="js/app.js"></script>
这是我的 app.js 脚本
(function() {
var app = angular.module('gemStore', []);
var gems = [
{ name: 'Azurite', price: 2.95, canPurchase: true},
{ name: 'Bloodstone', price: 5.95, canPurchase: true},
{ name: 'Zircon', price: 3.95, canPurchase: true},
];
app.controller('StoreController', function(){
this.products = gems;
});
})();
基本上，当对象“canPurchase”设置为 true 时，我只想显示“添加到购物车”按钮。 现在我能让按钮显示的唯一方法是这样做:
<button ng-show="!store.product.canPurchase">Add to Cart</button>
就好像 canPurchase 下的值在设置为 true 或 false 时没有做任何事情。 请帮助我理解这一点以及为什么它不能正常工作。
最佳答案
你需要使用
<button ng-show="product.canPurchase">Add to Cart</button>
不是 store.product.canPurchase，因为您目前在 ng-repeat 中。我很确定就是这样。如果您不引用单个产品项目，则表达式无效。
已验证在这个 jsfiddle 中更改此项有效 here
关于javascript - 按钮应该在值设置为 true 时显示，但事实并非如此，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/25395642/