0

私はこのようなhtmlを持っています

 <div ng-controller="newcontroller">
     <div class="firstdiv"  ng-show="show">welcome</div>
      <button ng-click="newfunction">click</button>
 </div>

このようなjsファイル

  app.controller('newcontroller',function($scope)
  {
         $scope.show=false
         $scope.newfunction=function()
         {
                $scope.show=true;

         }

  });

私はこのCSSのようなCSSを持っています

.firstdiv { 背景:緑; }

.newclass{背景:黒;}

ここで、クリックボタンをクリックすると、ウェルカムメッセージが表示されます。そのdivのcssを動的に変更したい。だから私はnewclassと呼ばれる別のcssクラス名を持っています.soをクリックすると、cssに変更を加えるためにその新しいクラスを適用する必要があります....どうすればいいですか？

4

3 に答える 3

1

式で使用ng-classしてスコープ変数をチェックする

これは、目的を達成するためにスコープ内の関数を必要としない例です。

<div ng-class="{newclass : toggle,firstdiv: !toggle} ">welcome</div>
<button ng-click="toggle=!toggle">click</button>

範囲内：

$scope.toggle=false;

このアプローチを使用すると、要素を変更するメソッドを記述する必要はありません。スコープ内の変数の状態を確認するだけで変更できます。

DEMO

于 2013-10-31T13:20:56.860 に答える