angularjsのng-disabledディレクティブが更新されない問題。

 

以下では読込直後のみUIが更新され、変数(btnDisabled)を更新してもUIが更新されない。

但しクリックは動作する。

 

<div class="btn" ng-disabled="{{btnDisabled}}" ng-click="hoge()">
    <div>
        <h4>ボタンです</h4>
    </div>
</div>
 

 

変数を{{}}で括っていた事が原因。

{{}}内の式は1度しか評価されない。

以下で正常にUIも変更される。

<div class="btn" ng-disabled="btnDisabled" ng-click="hoge()">
    <div>
        <h4>ボタンです</h4>
    </div>
</div>
 

 

相変わらずサンプルコード見ればすぐに分かる話で反省…。