我有一个关于 ng-repeat
和 ng-class
的问题 我有预定义的数据,我从通过 ng-repeat< 运行它的服务器获取
并将它们打印在 div
中,我有一个样式为按钮的另一个 div
我希望能够设置初始 div
说出来nth:child(3)
一个特定的样式,它将从其余部分突出显示它,但如果按下其他 div 的按钮将突出显示转移到它,仍然能够这样做。简而言之,从突出显示的 div 中获取样式并将其转移到点击。
到目前为止,我已经设法做到了这一点。
为了简单起见,我将把代码精简到最低限度。
view.html
<div class="offer__container" ng-repeat="price in settingsPrices" ng-class="{'selected': price.selected}">
//Omited code
<div class="offer__container__cta" ng-click="select(price)">Select
</div>
</div>
ViewCtrl.js
//Omitted code
$scope.select = function(price) {
price.selected = !price.selected;
}
stlye.css
//Omitted
.selected {
background-color: red;
font-size: 3em;
}
在当前状态下,div
样式为按钮,单击时会将更改应用于父级 div
,随后单击它会取消样式。我现在只需要让它独一无二的方法,所以如果先说 div
被点击,它就会有样式,但如果点击第 4 个,它应该从第一个开始取消样式并将其应用到第 4 个,依此类推...
最佳答案
<div ng-repeat = "price in settingsPrices">
<div ng-class="$index == seletedDiv ?'selected':''" ngclick="select($index)">select {{price}}</div>
</div>
$scope.seletedDiv = 0;
$scope.select = function(index) {
$scope.seletedDiv = index;
}
Hope this works for u.
关于javascript - ng-repeat 从 div 添加和删除样式,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/44915232/