angular.js - ng-repeat巢狀循環出來的ul li，如何做到預設顯示第一條Li是有樣式，目前被點擊的li有樣式其他的li則無樣式？

Question

提問：我用ng-repeat循環出來的數據，如何做到 ：1、打開頁面的時候，預設顯示第一個li是有樣式的？ 2.目前被點擊的li有樣式，其他的li則無樣式？
以下是html代碼圖：

<li ng-repeat="c in u.goods"  class="defaultClass" ng-click="twoClick($index)" >{{c.goods_name}}</li>
       </ul>

Answer 1

用ng-class，在$scope中建立一個chosedIndex變量，存放目前選取的li的index，預設為0，假設選取的class叫chosenClass，

<li ng-repeat="c in u.goods"  ng-class {"defaultClass":$index !=chosedIndex,'chosenClass':$index ==chosedIndex} 
ng-click="twoClick($index)" >{{c.goods_name}}</li>


----------
$scope.chosedIndex = 0;//默认是0使第一个有样式
$scope.twoClick = function(index){
    //保存点击的li位置
    $scope.chosedIndex = index;
}