AngularJS 不发送隐藏字段值

2022-08-30 01:34:20

对于特定的用例,我必须以“旧方式”提交单个表单。意思是,我使用一个带有action=“”的表单。响应是流式传输的,因此我不会重新加载页面。我完全知道典型的AngularJS应用程序不会以这种方式提交表单,但到目前为止,我别无选择。

也就是说,我试图从Angular填充一些隐藏的字段:

<input type="hidden" name="someData" ng-model="data" /> {{data}}

请注意,显示的数据中的正确值。

表单看起来像一个标准表单:

<form id="aaa" name="aaa" action="/reports/aaa.html" method="post">
...
<input type="submit" value="Export" />
</form>

如果我点击提交,则不会向服务器发送任何值。如果我将输入字段更改为键入“text”,它将按预期工作。我的假设是隐藏字段并没有真正填充,而文本字段实际上是由于双向绑定而显示的。

任何想法,我如何提交由AngularJS填充的隐藏字段?


答案 1

不能对隐藏字段使用双重绑定。解决方案是使用括号:

<input type="hidden" name="someData" value="{{data}}" /> {{data}}

编辑:在github上看到这个帖子:https://github.com/angular/angular.js/pull/2574

编辑:

从 Angular 1.2 开始,您可以使用 'ng-value' 指令将表达式绑定到输入的值属性。此指令应与输入无线电或复选框一起使用,但适用于隐藏输入。

以下是使用ng值的解决方案:

<input type="hidden" name="someData" ng-value="data" />

下面是一个使用 ng 值和隐藏输入的小提琴:http://jsfiddle.net/6SD9N


答案 2

您始终可以使用 a 和,因为 Angular 会忽略隐藏的元素。正如OP所说,通常你不会这样做,但这似乎是一个特例。type=textdisplay:none;

<input type="text" name="someData" ng-model="data" style="display: none;"/>