Angularjs 单击项目时如何设置背景色？

HTML

 <ul class="ul_nav">
    <li ng-class="class" ng-click="changeClass()">Marketing</li>
    <li ng-class="class" ng-click="changeClass()">Sells Team Nestle</li>
    <li ng-class="class" ng-click="changeClass()">Marketing Test</li>
    <li ng-class="class" ng-click="changeClass()">Marketing </li>                   
</ul>

CSS

.ul_nav{
    margin-top:15px;
    list-style:none;
    padding:0;
    height:600px;
}
.ul_nav > li{
    padding: 3px 0 3px 25px;
    cursor:pointer;
}

.ul_nav > li:hover{
    background:#ff9900;
    color:#fff;
}
.nav_color{
    background:#fff;
    color:#000;
}
.nav_active{
    background:#ff9900;
    color:#fff;
}

在这里，我可以更改导航的背景颜色。但当我点击一个项目，它会改变所有4个项目的背景颜色。如何解决这个问题。

HTML：

<ul class="ul_nav">
    <li ng-class="{class : classVar==='Marketing" }' ng-click="changeClass('Marketing')">Marketing</li>
    <li ng-class="{class : classVar==='Sells' }" ng-click="changeClass('Sells')">Sells Team Nestle</li>
    <li ng-class="{class : classVar==='MarketingTest' }" ng-click="changeClass('MarketingTest')">Marketing Test</li>
    <li ng-class="{class : classVar==='Marketing1' }" ng-click="changeClass('Marketing1')">Marketing </li>                   
</ul>

---

选中此项

您需要对代码进行以下更改

标记

<ul class="ul_nav">
  <li ng-class="class1" ng-click="changeClass('class1')">Marketing</li>
  <li ng-class="class2" ng-click="changeClass('class2')">Sells Team Nestle</li>
  <li ng-class="class3" ng-click="changeClass('class3')">Marketing Test</li>
  <li ng-class="class4" ng-click="changeClass('class4')">Marketing </li>
</ul>

---

您是否正在使用ng repeat创建此

li

。。？？

$scope.changeClass = function(value){
        $scope.classVar= value; 
    };
    $scope.myVar = false;
    $scope.toggle = function() {
        $scope.myVar = !$scope.myVar;
    };

<ul class="ul_nav">
  <li ng-class="class1" ng-click="changeClass('class1')">Marketing</li>
  <li ng-class="class2" ng-click="changeClass('class2')">Sells Team Nestle</li>
  <li ng-class="class3" ng-click="changeClass('class3')">Marketing Test</li>
  <li ng-class="class4" ng-click="changeClass('class4')">Marketing </li>
</ul>

$scope.changeClass = function(className) {
    className = (className === "nav_color") ? "nav_active" : "nav_color";
};