Угловой вход ограничен 1 полукокса

Question

Я хотел бы знать, почему я не могу ввести более одного символа на вход в этом примере:

http://jsfiddle.net/R3uY4/2/

<div ng-app> 
    <div ng-controller="ctrl"> 
    <table> 
      <tr> 
       <td ng-repeat="f in foo"> 
        <input ng-model="foo[$index]" style="width:60px" ></input> 
       </td> 
      </tr> 
     </table> 
    </div> 
</div> 

ЯШ:

function ctrl($scope) { 
    $scope.foo = []; 
    for (var i=0; i<5; i++) { 
     $scope.foo.push(''); 
    } 
} 

Answer 1

Вы привязываете свою модель к примитиву. Это не может работать так. Полное объяснение в этом github issue. Кроме того, ваш ng-repeat обновляется каждый раз при изменении входного значения. Вот почему вы теряете фокус.

Всегда связываются с объектами:

HTML:

<td ng-repeat="f in foo"> 
    <input ng-model="f.value" style="width:60px" /> 
</td> 

Контроллер:

function ctrl($scope) { 
    $scope.foo = []; 
    for (var i=0; i<5; i++) { 
     $scope.foo.push({value: ''}); 
    } 
} 

Answer 2

Если вы не против использования HTML5, вы можете использовать атрибут autofocus. Просто добавьте его в поле input.

<li ng-repeat="i in items">{{i.name}} <input ng-model="i.description" autofocus></li> 

Адрес fork of your jsFiddle.