angular.js - 如何在ng-repeat时默认第一个元素background-color为红色，点击对应元素背景变红同时更换其他全为黑色

Question

就是在ng-click中动态更改样式，请问有什么思路或方法嘛？急急急！！在线等！！！拜托了各位大神！！

Answer 1

Berikan idea mudah:
JS:

$scope.isActive = 0;
$scope.arr = [
    {
        //code here
    },
    {
        //code here
    }
];
$scope.selectItem = function (index) {
    item.isActive = index;
}

HTML:

<ul>
    <li ng-repeat="item in arr track by $index" ng-class="{red:isActive === $index, black:!isActive === $index}" ng-click="selectItem($index)"></li>
</ul>

CSS:

.red {
    background: red;
}
.black {
    background: black;
}

Tukar kod anda seperti ini:

HTML:

<p class="p10 c-white w50p fl mr1 tc" ng-repeat="e in item.images">
    <p class="w50p h50 img_p" ng-class="{b-red:isActive === $index,b-white:!isActive === $index}" ng-click="changeGood($index)">
        <img src="{{e.path}}">
    </p>
    <span class="ib w50p fs0-6 span-over">{{e.description}}</span>
</p>

pengawal:

$scope.isActive=0;

$scope.changeGood=function(index){
    $scope.isActive=index;
    
}

Answer 2

Saya telah menjawab soalan yang sama dengan soalan anda yang dibangkitkan oleh orang lain sebelum ini, saya telah menukar demo yang saya tulis sebelum ini dan menghantarnya kepada anda sepenuhnya. Anda boleh melihatnya dan jika anda tidak melihat kesannya , sila Panjat dinding, demo adalah seperti berikut:
Demo