通过html表单实现多变量的angular 1.x数组推送
通过HTML表单实现多变量的Angular 1.x数组推送可以通过以下步骤实现：
- 在HTML页面中创建一个表单，使用
ng-app和ng-controller指令来定义Angular应用和控制器。
<!DOCTYPE html>
<html ng-app="myApp">
<head>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.7.9/angular.min.js"></script>
</head>
<body ng-controller="myController">
<form ng-submit="pushToArray()">
<input type="text" ng-model="inputValue">
<button type="submit">添加到数组</button>
</form>
<ul>
<li ng-repeat="item in array">{{ item }}</li>
</ul>
<script>
var app = angular.module('myApp', []);
app.controller('myController', function($scope) {
$scope.array = [];
$scope.pushToArray = function() {
$scope.array.push($scope.inputValue);
$scope.inputValue = '';
};
});
</script>
</body>
</html>- 在控制器中定义一个空数组
array，并创建一个pushToArray函数来将输入值添加到数组中。 - 在表单中使用
ng-model指令将输入框的值绑定到inputValue变量上。 - 使用
ng-submit指令在表单提交时调用pushToArray函数。 - 使用
ng-repeat指令在页面上循环显示数组中的每个元素。
这样，当用户在输入框中输入值并点击提交按钮时，该值将被添加到数组中，并在页面上显示出来。
对于这个问题，腾讯云没有特定的产品或链接地址与之相关。但腾讯云提供了丰富的云计算服务，如云服务器、云数据库、云存储等，可以帮助开发者构建和部署各种应用。您可以访问腾讯云官方网站（https://cloud.tencent.com/）了解更多信息。
相关·内容
我想通过我的数组中的html表单来推送文本。问题是，我看过的每个教程都只解释了如何添加一个变量。My Array：(这就是我的意思) title: 'New Divide', album: 'New Divide',
genre: 'Rock
浏览 3提问于2017-07-29得票数 1
回答已采纳
在Angular 2.0中，使用form Builder的模型驱动表单， this.user = this.fb.group({ alert("Change detected); }<input type="text" f
浏览 2提问于2017-04-20得票数 2
1回答
在角4+中有一个反应性形式，其中有多个check boxes，如下所示：现在，用户可以选择尽可能多的复选框。因此，此表单的输出是选中的复选框的数组，如下所示： "I have a bike", "I have a test"我不知道如何在reactive请注意，我使用的是以下内容：
import {FormGroup,
浏览 3提问于2018-01-06得票数 0
2回答
我有一个数组。我需要将表单数据作为对象与表单提交一起发送。检查下面的代码https://stackblitz.com/edit/angular-r9astq?
浏览 24提问于2021-10-25得票数 0
嵌套形式在反应形式中是可能的，但我不知道如何在angular 2中以动态形式实现它，那么在angular 2中它在动态形式中是可能的吗？
浏览 3提问于2017-08-11得票数 1
convert:- path: /foo.es.vtt actions:因此，有一个单一的音频轨道和字幕轨道的列表，任何这些轨道都是可选的。我想将每个曲目封装为一个组件，它有一个FormGroup，它是单个表单的一部分。使用按钮添加或删除轨道。
我还没有找到任何这样做的例子。我发现了一些重点放在添加和删除单个控件的内容，而不是整个表
浏览 0提问于2018-07-06得票数 0
回答已采纳
我对前端框架非常陌生，我正在学习Angular 2。在教程中，它告诉你要包含bootstrap(AppComponent)这一行。这个bootstrap函数做什么？这仅仅是启动应用程序的原因吗？
浏览 6提问于2016-02-27得票数 8
我之所以使用react-router-4CloudFront，是因为我将静态构建放到了AWS存储桶中，并通过HashRouter提供服务。我想要的是：example.com/#/accounts_ to be _example.com/accounts
在angular 1.x中，我会使用$locationProvider.html5Mode(true)来实现同样的功能。
浏览 0提问于2017-12-08得票数 1
我还在学习Angular 5，并且已经开始使用"reactive“表单模型。然而，几乎我能找到的每个示例和教程都让您在一个模板中创建整个表单。通常在AngularJS 1.x中，我们会将每个字段存储在它自己的指令中，然后将它们连接在一起以创建一个表单来减少重复。有没有办法使用Angular 5 reactive forms，只使用一个文件，并包含模板和所有验证？我可以分两部分来看如何实现这一点，在这两个部分中，我将拥有一个包
浏览 3提问于2017-12-18得票数 4
3回答
= [];var spielObjekt = {team1: "Teamname 1", team2: "Teamname 2", court: ""};最后，数组看起来是这样的：对象的内容并不重要，因为角应该执行ng-重复两次，只显示我的文本两次-但是ht
浏览 0提问于2016-12-14得票数 1
将AngularJS与其他JavaScript-MVC框架区分开来的一件事是，它能够使用绑定将绑定的值从JavaScript回显到HTML中。当您将任何值赋给$scope变量时，Angular会“自动”执行此操作。
但是这有多自动呢？有时，Angular不会接受更改，因此我需要调用$scope.$apply()或$scope.$digest()来通知angular接受更改。有时，当我运行这两个方法中的任何一个时，它都会抛出一个错误，并
浏览 0提问于2012-09-18得票数 76
回答已采纳
我正在使用Angular，并希望实现以下功能。 在表单中，用户可以上传多个图像。在表单提交时，我希望使用post方法调用upload端点的次数与图像一样多(简单的for循环)。每次调用都会返回一个响应，其中包含每个图像的google云平台存储链接。每次我都会将链接推送到一个数组。在遍历所有图像之后，我想最终提交post/patch请求，其中包含来自表单的json数据和指向
浏览 2提问于2020-10-29得票数 2
回答已采纳
我们已经实现了一个Angular组件库，其中包含自定义输入、textareas、datepicker等元素，我们希望在不同的应用程序中使用它们。我们实现了一个通用的Angular组件库，以便在不同的Angular应用程序之间共享我们的UI组件(表单元素)。表单组件在库中工作正常，ControlValueAccessor可以与ngModel一起工作，并将适当的值推送
浏览 3提问于2019-01-12得票数 2
(这里我有一个带from的表格，当我从Pomaterials中选择一个值时，我想要补丁值，array.It在表格的底部。但是当我选择项目时，它的抛出错误，找不到带有路径的控件。我尝试了formControls而不是数据源，仍然给出相同的错误。你能帮我吗？)
浏览 20提问于2020-06-13得票数 0
我正在尝试将消息推送到已经声明为组件中的变量的数组中。我正在使用一个服务，并创建了一个可以观察到的主题，可以从一个组件获取数据并将其注入到另一个组件中。当我尝试在订阅变量后将数据推送到数组上时，它会被临时更新，但当我打开该组件时，数据不会被推送。当我从订阅方法内部控制台日志时，数组会更新，但一旦打开该组件，它就会被重置。我不知道有什么问题。/login.component.html
浏览 3提问于2020-11-25得票数 2
回答已采纳
1回答
我的用户在站点上的其他地方使用不受symfony2控制的登录表单。
我想要的是Symfony通过读取会话变量并与DB进行比较来检测用户是否已经登录并进行身份验证。我不想在网站的symfony部分重新实现登录表单。例如，在symfony 1.x中，我会简单地重载BasicSecurityUser类并使用setAuthenticated方法，但这在Symfony2中似乎是不可能的。有什
浏览 0提问于2012-04-11得票数 0
回答已采纳
3回答
我需要复制一些输入字段，以便处理来自客户端的数据。我已经用jQuery 做过了<fieldset id="fields-list"> <div class="pure-u-1-function () $(".entry:first").clone(false).appendTo("#fields-list");});
然
浏览 0提问于2013-12-04得票数 2
回答已采纳
我使用Angular 1.x通过拖放界面提供多文件上传功能。我想使用一个标志将其中一个图像作为默认的种子。listing_images: Array(3) default_image: 1
lastModified这段代码显示了要上传的3张图片中的</em
浏览 0提问于2019-08-16得票数 0
我编写了以下代码来执行输入字段的验证。在这里，我通过一个函数将输入字段的状态从HTML传递给脚本。但是我只需要调用函数而不传递任何参数，并且这些值应该直接在脚本中获得，而不是从HTML传递。HTML部件： return true; return false; });
我的<
浏览 1提问于2017-09-21得票数 1
我试图通过锁定一个id来添加Html。Html正在显示，但是ngModel和click不起作用。我怎么才能让它起作用？app.component.htmlapp.component.ts})
export class A
浏览 3提问于2018-04-27得票数 1
扫码
添加站长 进交流群
领取专属 10元无门槛券
手把手带您无忧上云
相关资讯
热门标签
云服务器
ICP备案
对象存储
腾讯会议
实时音视频活动推荐
腾讯云开发者
