web-dev-qa-db-ja.com

ng-clickでcssを切り替えます

これが私のコードの基本的な考え方です。

HTML（翡翠）：

#preferencesBox(ng-click="toggleCustom()")
   .glyphicon.glyphicon-heart

CSS：

#preferencesBox.active{
   color: #d04f37;
}

角度：

$scope.check = true;
$scope.toggleCustom = function() {
    $scope.check = $scope.check === false ? true: false;
};

Cssを追加したいcolor : #d04f37ユーザーが親をクリックしたとき#preferencesBox。追加/削除.activeはjQueryの方法です。私のng-classまたは残りのコードは次のようになりますか？

cssangularjsangularjs-ng-click
8
Diolor

check変数を監視するng-class内の式を使用できます。

ng-class="{'active' : check}"

check = trueの場合、クラスactiveを追加します

15
tymeJV

次の例を見て、ジェイドに適用してください。

_<header ng-click="click()" ng-class="{'active': active == true}">Hello</header>
_

次に、コントローラーで：

_$scope.click = function(){
    $scope.active = true;
}
_

これは、開始してclick()に切り替えるためのロジックを追加するのに十分簡単だと思います（これはifのみです）。

5
danielrozo