angular.js - How to automatically get focus after displaying textarea in angularjs

Question

<p ng-repeat="x in inputContent track by $index">
    <p ng-if="x.hint" ng-click="toEdit({{$index}})" class="lc-hint">{{x.placeholder}}</p>
    <textarea ng-if="!x.readable" ng-model="x.value"></textarea>
</p>

Multiple such structures are generated by ng-repeat. The textarea is hidden at first. Click lc-hint to make the textarea appear. How to automatically gain focus.

The setfocus command in the official documentation does not seem to work. Help

Answer 1

There is something wrong with your code:

ng-click="toEdit({{$index}})"

should be written as

ng-click="toEdit($index)"

Why not use the native one and add the id of textarea to abc;

document.getElementById("abc").focus();

If you input in the console, it is best to add a delay. The focus of textarea can only be triggered when the current page is in focus state. After typing, click anywhere on the page immediately to trigger:

setTimeout(function(){document.getElementById("abc").focus();},1000);

The setfocus you encounter does not take effect, it may be because the current page is not in focus.

Put it in your code environment, add textarea with id, the prefix I wrote is suibianla_{whatever}:

<textarea id="suibianla_{{ $index }}" ng-if="!x.readable" ng-model="x.value"></textarea>

$scope.toEdit = function(index){
    //你的业务代码
    inputContent[index].readable = true;    //我猜你是这样写的，在这里后边加一句
    document.getElementById("suibianla_" + index).focus();
}