如何在模板中的输入处使用Angular的ngFocus指令（或Ionic Framework中嵌入的任何指令）向元素添加类？

Question

我有一个这样的模板：

    <label class="item item-input"
           ng-class="{'focus':authData.username.focus}"> <--add class here if input:focus
        <span class="input-label">Username</span>
        <input type="text"
               name="username"
               ng-model="authData.username"
               ng-focus="" <--check if focus
               required ng-minlength="5" ng-maxlength="20">
    </label>

如何检查输入是否具有焦点并将类添加到标签中？是否可以在控制器中没有外部功能？

Answer 1

<label class="item item-input"
           ng-class="{'focus':focus===true}">
        <span class="input-label">Username</span>
        <input type="text"
               name="username"
               ng-model="authData.username"
               ng-focus="focus=true" ng-blur="focus=false"
               required ng-minlength="5" ng-maxlength="20">
    </label>

使用ngFocus和ngBlur指令检测元素上的焦点更改，并相应地将var focus的值更新为true / false。