angularjs - Add new text box on click of a button in angular js -
how add new text box when submit button pushed. have tried , know there's thing wrong. still new angular js.
example:
<!doctype html> <html lang="en"> <head> <meta charset="utf-8"> <title>example - example-ngcontroller-production</title> <script src="//ajax.googleapis.com/ajax/libs/angularjs/1.4.0/angular.min.js"></script> <script> angular.module('controllerasexample', []).controller('settingscontroller1', function ($scope) { $scope.contacts=[] $scope.addcontact = function() { $scope.contact.push({$scope.contact}) } }); }; </script> </head> <body ng-app="controllerasexample"> <div id="ctrl-as-exmpl" ng-controller="settingscontroller1"> <ul> <li ng-repeat="contact in contacts"> <input type="text" ng-model="contact" /> </li> <li><button ng-submit="addcontact()">add</button></li> </ul> </div> </body> </html>
in code, doing:-
$scope.addcontact = function() { $scope.contact.push({$scope.contact}) }
this problem is. if need add empty textbox, need add empty contact contacts, , ng-repeat take care of adding new textbox in list. thing pushing contact, , not contacts.
also, ngsubmit used inside form, not have. so, use ng-click instead. here plunker showing code working.
$scope.addcontact = function() { $scope.contacts.push({ name: '' }); }
Comments
Post a Comment