angularjs - 如果值来自ng-model，angularjs在相应的HTMLinput上调用select不会突出显示单元格内容？

Question

我正在尝试选择（突出显示）其值来自模型的输入元素中的文本，但它似乎不起作用。

有问题的元素（组件模板的一部分）如下：

<input id="table-input-cell" ng-blur="$ctrl.inputBlur()"
       ng-focus="$ctrl.inputFocus($event)" ng-model="$ctrl.activeText"
       class="input-cell"/>

控制器函数如下所示：

ctrl.inputFocus = function(focusEvent) {
    let el = ctrl.inputView[0];
    console.log(el.constructor.name);
    console.log(`inputFocus called.  contents: ${el.value} `);
    el.select();
};

我在页面上看到的结果是这样的：

我想看到的是：

这是控制台输出：

HTMLInputElement
budget_controller.source.js:261 inputFocus called.  contents:  

所以看起来问题是ng-focus在输入框的值被填充之前可能会被调用ng-model，这就是为什么.select()不突出显示任何内容的原因。

或者也许是别的什么？无论如何，一旦元素被绑定为具有焦点，AngularJs 中是否还有其他一些生命周期事件可以用来设置选择范围？我在 dox 中没有看到任何东西 ngBound= 。

标签： angularjs

Answer 1

使用事件目标：

ctrl.inputFocus = function(focusEvent) {
    ̶l̶e̶t̶ ̶e̶l̶ ̶=̶ ̶c̶t̶r̶l̶.̶i̶n̶p̶u̶t̶V̶i̶e̶w̶[̶0̶]̶;̶
    let el = focusEvent.target;
    console.log(el.constructor.name);
    console.log(`inputFocus called.  contents: ${el.value} `);
    el.select();
};

PLNKR 上的DEMO