简体   繁体   English

将焦点设置为输入元素角度js

[英]Set focus to input element angular js

I got a student database with input text element. 我有一个带有输入文本元素的学生数据库。 While the page is loaded a student must be highlighted with input text focussed. 在加载页面时,必须以输入文本为中心突出显示学生。

I added a dynamic class that will set the focus if set true. 我添加了一个动态类,如果设置为true,将设置焦点。 If i map it with a static class it works fine. 如果我用静态类映射它可以正常工作。 If i map it with dynamic class, it doesnt. 如果我用动态类映射它,它不会。

What is the right way i can pick the dynamic class for the directive. 我可以为指令选择动态类的正确方法是什么。

Here is my JSFIDDLE CODE 这是我的JSFIDDLE代码

Commenting these tds one at a time will help you to understand the issue 一次一个地评论这些tds将有助于您理解该问题

<td><input type="text" ng-class="student.focus?'focus-me':''"></td>  //dynamic class
 <td><input type="text" class="focus-me"></td> // static class

This fiddle could help you understand how to properly set a class using ng-class. 这个小提琴可以帮助您了解如何使用ng-class正确设置类。

<input type="text" ng-class="{'focus-me':student.focus}">

When value of student.focus is true, 'focus-me' class get applied in input tag. 当student.focus的值为true时,'focus-me'类将应用于输入标记。

At first try I would simply extend that directive: 首先尝试我只是扩展该指令:

  link: function(scope, element,attributes){
    if ($parse(attributes.focusMe)(scope)) {
        element[0].focus();
    }
  }

In html: 在html中:

<td><input type="text" focus-me="student.focus"></td> 

https://jsfiddle.net/hph1sja2/ https://jsfiddle.net/hph1sja2/

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM