Угловое значение на входе привязано к переменной модели

Мне нужна помощь в обнаружении проблемы в моем коде. Angular.js связывает входные значения с ng-model для меня, а это не то, что мне нужно. У меня есть повторитель angular с ng-include, например:

<div ng-repeat='item in items'>
  <label>{{item.number}}</label>
  <div ng-include='item.template'></div>
</div>

Включенный шаблон элемента представляет собой простое поле ввода, основанное на элементе item.template. Для меня проблемными тегами являются ‹textarea> и ‹input>.

Т.е. я включаю это:

<input type="text" ng-model="item.number" />

Товар выглядит так:

{
  number: 1
  , template: 'text'
  , text: 'Some text'
  , value: 'Some value'
}

Итак, когда вещь выше рендерится, я получаю

<input type="text" ng-model="item.number" class="ng-scope ng-pristine ng-valid">

Но проблема в том, что в моем поле ввода у меня есть номер элемента в качестве значения, и если я изменю значение, моя метка также изменится. Даже если я поставлю value="" или placeholder="blah", я все равно получу это поведение.

Я еще не дошел до этого, но я полагаю, что модель также обновлена ​​​​с номером.

Что я там делаю не так?


person Zlatko    schedule 10.06.2013    source источник
comment
это то, что ожидается, это двухсторонняя привязка данных   -  person Abhishek Nandi    schedule 10.06.2013
comment
@ Atrix1987 Atrix1987 Спасибо, вот и все :) Наверное, мне следует указать name=item.number и привязать ng-модель к чему-то дополнительному.   -  person Zlatko    schedule 10.06.2013


Ответы (2)


очевидно, {{item.number}} привязан к вашему объекту элемента (двусторонняя привязка FTW! :-)). Если вы хотите, чтобы эта метка была установлена ​​​​при рендеринге и оставалась неизменной, то в вашем контроллере вы должны создать еще одно поле в каждом элементе с именем «originalNumber» и привязать свои метки к этому полю.

person Tom Teman    schedule 10.06.2013
comment
Нет, в основном мне нужно было ввести name=item.number ng-model=что-то еще, чтобы зацепиться - person Zlatko; 10.06.2013
comment
О, я думал, вы хотите оставить поле редактируемым, но иметь неизменяемую метку (заполненную исходным значением поля). - person Tom Teman; 10.06.2013

Angular создает двустороннюю привязку между моделью и входными элементами, когда используется ng-model. Любые изменения в модели обновляют элемент ввода (поведение по умолчанию для всех привязок), и любое изменение, выполненное в элементе ввода пользовательского интерфейса, обновляет модель.

Чтобы избавиться от этого поведения, вы можете

<input type="text" value='{{item.number}}' class="ng-scope ng-pristine ng-valid">
person Chandermani    schedule 10.06.2013