HTML属性根据条件返回true

时间:2017-07-31 12:36:15

标签: javascript angularjs

我在每个重复的项目中都有输入框的ng-repeat。我已将自动对焦设置为输入。

<input type="text" autofocus />

因此自动对焦将应用于所有项目。但是,iOS中存在一个错误,即最后一个输入框是自动聚焦而不是第一个输入框。

我需要根据条件将其设置为返回true,如下所示:

<input autofocus="{{$first  ? 'true' : 'false' }}" >

知道如何使用Angular完成此任务吗?

1 个答案:

答案 0 :(得分:0)

使用自定义指令来聚焦元素

指令

app.directive('autofocus', ['$timeout', function($timeout) {
  return {
    restrict: 'A',
    link : function(scope, element,attrs) {
       $timeout(function() {
       if(attrs.autofocus==='true'){
        element[0].focus();
       }
      });
    }
  }
}]);

控制器

app.controller('MainCtrl', function($scope) {
  $scope.names = ['first','second','third','fourth','fifth'];
});

HTML

 <div ng-repeat="name in names">
    <input type="text" autofocus="{{$index==0}}" ng-model="name" />
    </div>

演示plunker link