angularjs – 单击角度js中的按钮添加新文本框

发布时间：2020-12-17 07:56:03 所属栏目：安全来源：网络整理

导读：按下提交按钮时如何添加新文本框.这是我尝试过的,我知道有些事情是错的.我仍然是棱角分明的新手. 例： !doctype htmlhtml lang="en" head meta charset="UTF-8" titleExample - example-ngController-production/title script src="//ajax.googleapis.com/aj

按下提交按钮时如何添加新文本框.这是我尝试过的,我知道有些事情是错的.我仍然是棱角分明的新手.

例：

<!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>

在您的代码中,您正在做： –

$scope.addContact = function()
        {
          $scope.contact.push({$scope.contact})
        }

这就是问题所在.如果您只需要添加一个空文本框,则只需要向联系人添加一个空联系人,ng-repeat将负责在列表中添加新文本框.另一件事是你正在接触,而不是接触.

此外,ngSubmit在表单中使用,您没有.因此,请改用ng-click.这是一个显示代码工作的plunker.

$scope.addContact = function()
            {
              $scope.contacts.push({ name: '' });
            }

（编辑：李大同）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!