Как добавить текст в текстовое поле с полем ввода и удалить его из текстового поля с помощью Angular JS?

0

Я создал две формы. Во-первых, я могу отправить несколько типизированных элементов в массив для отображения в текстовом поле во второй форме. Текстовое поле во второй форме должно отображать элементы в массиве, поскольку новые элементы добавляются из первой формы. Я хочу иметь возможность удалять элементы в текстовом поле и удалять элементы из массива перед сохранением. Я также хочу выбрать один элемент из массива в качестве первичного имени. У меня есть поле ввода во второй форме, настроенной для выбора первичного имени.

В приведенном ниже коде есть несколько проблем: 1) Текстовое поле не добавляет новые элементы, поскольку они либо набраны, либо отправлены из первой формы. 2) Если я помещаю информацию в свой хранилище данных, она появится в моем текстовом поле, так как я установил ее как редактируемую форму, но когда я удаляю информацию из текстового поля, она не удаляет ее из моего массива (по крайней мере, из того, что я могу сказать). 3) Выбор первичного имени работает несколько, но он глючит и, кажется, работает ровно каждый раз, когда я пытаюсь изменить значение в нем.

У меня создалось впечатление, что ng-bind (или, возможно, ng-list?) Будет координировать данные в DOM с изменениями в модели. Где я иду не так? Я просмотрел несколько ссылок по этому вопросу, которые были несколько полезны, но я не могу полностью применить их к задаче:

https://docs.angularjs.org/api/ng/directive/ngBind
https://docs.angularjs.org/api/ng/directive/ngList
http://codepen.io/NicholasMurray/pen/ogmLyy
http://stackoverflow.com/questions/16125872/why-ng-bind-is-better-than-in-angular

Мой HTML:

<form class="first-signup-inner-form" ng-submit="submit()">
<input list="names" ng-model="aliases" type="text" placeholder="Names">
<input type="submit" value="Submit">
</form>

<form class="first-signup-inner-form" editable-form name="editableForm">
<textarea class="w-input alias-text-field" id="Aliases" placeholder="All Names" name="Aliases" ng-bind="list"></textarea>
<input class="w-input business-name-text-field" list="aliases" ng-model="user.Name" id="Business-Name" type="text" placeholder="Official Name" name="Business-Name" required="required">
<datalist id="aliases"><option data-ng-repeat="alias in list" value="{{alias}}"></datalist>
</form>

JS:

$scope.list = [];
$scope.aliases = "";
$scope.submit = function(){
            if ($scope.aliases){
              $scope.list.push(this.aliases);
              $scope.aliases = "";
            }
          };
  • 0
    Благодарю. Это на самом деле не в моем реальном коде - эта ошибка была введена, когда я ее порезал. Я исправлю это сейчас.
  • 0
    Может также показать дополнительную информацию, такую как вся ваша структура HTML, контроллер и т. Д.
Показать ещё 15 комментариев
Теги:
arrays
forms

1 ответ

0
Лучший ответ

Итак, это ответ на ваш вопрос .

  • 0
    ответ обратный - я хочу добавить в поле, когда я нажимаю кнопку отправить, и я хотел бы выборочно удалить элементы, добавленные в поле, если была допущена ошибка. Я не могу контролировать, какие элементы удаляются с помощью вашего решения.
  • 0
    @rashadb это был только намек. Вы можете понять остальное очень легко. так что я думаю, что подсказка более полезна для вас.
Показать ещё 4 комментария

Ещё вопросы

Сообщество Overcoder
Наверх
Меню