AngularJS 不发送隐藏字段值

javascript angularjs forms

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

编辑：

从 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;"/>