Css 使用ng click事件更改项目的样式

我需要在单击li标记时更改其背景色

   <ul>
       <li>
          <a ng-click="changeCategory(2)">Category 1</a>
       </li>
       <li>
          <a ng-click="changeCategory(2)">Category 2</a>
       </li>
       <li>
          <a ng-click="changeCategory(3)">Category 3</a>
       </li>
       <li>
          <a ng-click="changeCategory(4)">Category 4</a>
       </li>
   <ul>

   $scope.changeCategory = function(id){

   }

第一类


第2类


第3类


第4类


$scope.changeCategory=函数（id）{
}

我只需要按一下更改背景色。如果有人能调查一下，那就太好了。

css

.selected {
  background-color: #eee;
}

html

<ul>
   <li ng-class="{'selected': category === 1}">
      <a ng-click="changeCategory(1)">Category 1</a>
   </li>
   <li ng-class="{'selected': category === 2}">
      <a ng-click="changeCategory(2)">Category 2</a>
   </li>
   <li ng-class="{'selected': category === 3}">
      <a ng-click="changeCategory(3)">Category 3</a>
   </li>
   <li ng-class="{'selected': category === 4}">
      <a ng-click="changeCategory(4)">Category 4</a>
   </li>
<ul>

注意

我将您的第一个锚更改为

changegority（1）

，而不是

changegority（2）

，假设这是您的意图。此外，这也迫切需要一个

ng repeat

来满足这个原则。

css

.selected {
  background-color: #eee;
}

html

<ul>
   <li ng-class="{'selected': category === 1}">
      <a ng-click="changeCategory(1)">Category 1</a>
   </li>
   <li ng-class="{'selected': category === 2}">
      <a ng-click="changeCategory(2)">Category 2</a>
   </li>
   <li ng-class="{'selected': category === 3}">
      <a ng-click="changeCategory(3)">Category 3</a>
   </li>
   <li ng-class="{'selected': category === 4}">
      <a ng-click="changeCategory(4)">Category 4</a>
   </li>
<ul>

注意

---

我将您的第一个锚更改为

changegority（1）

，而不是

changegority（2）

，假设这是您的意图。同样，这也需要一个

ng repeat

来满足这一原则。

这个问题没有被接受的答案的可能重复这个问题没有被接受的答案的可能重复