0

私のhtml

<li data-ng-click="sortCategory('demographics')">Demographics</li>
<li data-ng-click="sortCategory('historical')">Historical</li>
<li data-ng-click="sortCategory('experimental')">Experimental</li>

私は試した

<li data-ng-click="sortCategory('socialmedia'); select(item)" data-ng-class="{active: isActive(item)}">Social Media</li>

$scope.isActive = function (item) 
     {
return $scope.isActive(item);
     }

css (レス)

li{
&.active {
  background:#0088cc;
}
}

機能していません...

4

1 に答える 1

2

ヨッシーに完全に同意すると、sortCategory 関数を呼び出すときにカテゴリをスコープ変数に格納し、これを使用してカテゴリがアクティブかどうかを確認できます。コードの作業部分は次のようになります。

 $scope.category = 'demographics'; //Your default category
 $scope.sortCategory = function (category) {
   $scope.category = category; //Update the category
   ....
 }

 $scope.isActive = function (category) {
   //Check if category of a given <li> is equal to the current category
   return $scope.category === category;
 }

そして、次のようなテンプレート マークアップ

<li data-ng-click="sortCategory('demographics')" ng-class="{'active' : isActive('demographics')}">Demographics</li>
<li data-ng-click="sortCategory('historical')" ng-class="{'active' : isActive('historical')}">Historical</li>

ここで実際の例を見つけることができますhttp://jsfiddle.net/sWKL5/2/

于 2013-09-06T08:45:40.713 に答える