SL-A-SH Ответов: 1

Как добавлять и удалять элементы в angularjs

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

Я включил свой кодовый код.

Сайт CodePen[^]

Что я уже пробовал:

Я пробовал использовать jQuery, но не думаю, что хорошо использовать как jQuery, так и AngularJS, когда это можно сделать только с помощью AngularJS

Karthik_Mahalingam

jquery будет проще для этого

SL-A-SH

Я знаю, но все мое приложение находится в AngularJS

Karthik_Mahalingam

ладно, где ты застрял ?

SL-A-SH

удаление элементов, которые я добавляю, Если нажимаю кнопку+. Добавленные элементы должны быть удалены, если я нажму кнопку -. Проверьте мой кодовый код

Karthik_Mahalingam

вы имеете в виду динамические строки?

SL-A-SH

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

1 Ответов

Рейтинг:
7

Karthik_Mahalingam

Цитата:
Когда я нажимаю кнопку + в комнатах, добавляются дополнительные элементы выбора для взрослых и детей. Точно так же я хочу, чтобы эти добавленные элементы были удалены, когда я нажимаю кнопку - на комнатах


$scope.minusRoom = function () {
               if ($scope.room > 1) {
                   $scope.room--;
                   $scope.price = $scope.price - 2500;
                   var div = document.querySelector('div');
                   var rows = div.querySelectorAll('.spanrow')
                   var last = rows[rows.length - 1];
                   div.removeChild(last);


               }
           }
           $scope.addRoom = function () {
               if ($scope.room < 10) {
                   $scope.room++;
                   $scope.price = $scope.price + 2500;
                   var myEl = angular.element(document.querySelector('div'));
                   myEl.append('<span class="spanrow">Adult: <input type="button"value="-"></input><input type="text" ng-value="room" readonly="readonly"><input type="button" value="+"><span> Child:<input type="button"value="-"></input><input type="text" ng-value="room" readonly="readonly"><input type="button" value="+"><br/>');
               }

           }


Это удалит динамически добавляемые строки из DOM, но объекты $scope вам придется позаботиться о том, чтобы удовлетворить бизнес-потребности.