[英]Angular JS: Change only clicked button text in ng-repeat
我是Angular JS的新手。 我有一些产品要显示在使用ng-repeat显示的主页中。 每个产品都有一个“添加到购物车”按钮,该按钮也会使用ng-repeat显示。 我的问题是,我想更改正在单击的特定按钮的文本。 我使用了“切换”,所有按钮的文字都在变化。 请有人帮我解决这个问题。
我的HTML代码:
<div class="col-md-3 col-sm-6" ng-repeat="item in products">
<div class="thumbnail">
<image src="{{item.imageUrl}}"></image>
</div>
<div>
<button class="btn btn-primary" ng-click="toggle(item)">{{buttonText}}</button>
</div>
</div>
我的角度js代码:
var toggle = false;
$scope.toggle = function(item){
$scope.buttonText = toggle ? 'Add To Cart' : 'Remove From Cart';
toggle=!toggle;
}
您需要向传递的项目添加一个属性。然后使用该属性。 更改范围将更改所有实例。
var toggle = false;
$scope.toggle = function(item){
item.buttonText = toggle ? 'Add To Cart' : 'Remove From Cart';
toggle=!toggle;
}
<div class="col-md-3 col-sm-6" ng-repeat="item in products">
<div class="thumbnail">
<image src="{{item.imageUrl}}"></image>
</div>
<div>
<button class="btn btn-primary" ng-click="toggle(item)">{{item.buttonText}}</button>
</div>
</div>
有点像上面
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.