javascript - AngularJS、入力が変更されたときにボタンにクラスを設定

Question

長いリストのフィルターである入力フィールドがあります。入力フィールドの横には検索アイコンがあります。基本的に、ユーザーが入力を開始したら、アイコンクラスを変更する必要があります。

私はテキストフィールドを次のように設定しています：

<input type="text" ng-change="change()" ng-model="query" />
<button class="btn"><i class="icon-search"></i></button>

私のコントローラー内で私は定義しました：

$scope.change = function()
{
    //change the class of button based on the length of the input field     
}

angularを使用してフィールドに入力があるかどうかを判断し、クラスを変更する方法がよくわかりません。ここで正しいアプローチを取っていますか？ありがとう

score 4 · Accepted Answer

4

ng-model で ng-class を使用できます

<i ng-class="{'icon-search': query.length}"></i>

于 2013-03-08T23:29:33.563 に答える

score 1 · Accepted Answer

ngClass を使用するだけです。関数 $scope.change はクラス名を返す必要があるため、

<button ng-class="change()"><i class="icon-search"></i></button>

コントローラー関数は次のようになります。

$scope.change = function() {
    if(something){
        return "classA";
    }
    else{
        return "classB";
    }
};

2 に答える 2