5

当我发布带有 Angular 选择的表单时，它会发送所选选项的数组索引，而不是其值。我需要发送字符串，因为服务器不知道这些索引。我怎样才能解决这个问题？

来自jsfiddle.net/2SuZG：

<form method="post" action="/my/post/endpoint">
    <select name="resource" ng-options="r for r in ['a', 'b']"
            ng-model="selectedResource"></select>
    <button type="submit">Save</button>
</form>

您可以从小提琴中的控制台输出中看到已发布的表单正在发送resource=0，但我想要resource='a'。（注意：在我的小提琴中，我正在序列化表单，但这只是为了看看它会发布什么。在我的应用程序中，我实际上是在发布到一个真实的端点。）

这类似于这个问题，但答案是“不要担心价值”。但就我而言，我正在发布一个表格，所以我关心它的价值。我必须在这里遗漏一些非常基本的东西。谢谢！

4

4 回答 4

6

您不应该使用 jquery 序列化表单，因为您在 $scope 中拥有所有相关数据，而这正是您想要序列化的内容（您将使用 $http 或 $resource 发布的某个子集或某个对象） . 如果您对自己的方法一无所知，请使用数据元素的真实名称创建一个隐藏输入：http: //jsfiddle.net/2SuZG/1/

<select name="resourceTemp" ng-options="r for r in ['a', 'b']"
        ng-model="selectedResource"></select>
<input type="hidden" name="resource" value="{{selectedResource}}" >

我不会推荐这个，但这是你想要做的。

于 2013-05-26T19:14:10.393 回答
3

ng-option 适用于数组。如果你想像这样使用 ng-option make array

r = [{ "value": 1, "text": "a" }, { "value": 2, "text": "v" }];  

<select ng-option="obj.value as obj.text for obj in r">

或者您可以在您的情况下使用 ng-repeat

<form method="post">
        <select name="resourceTemp" ng-model="selectedResource">
            <option ng-repeat="r in ['a','b']" value="{{r}}">{{r}}</option>
        </select>
        <input type="hidden" name="resource" value="{{selectedResource}}" >
        <button type="submit">Save</button>
</form>

http://jsfiddle.net/nHyET/

于 2013-05-28T10:54:06.803 回答
1

简单的答案是不要发布表格。如果要将POST数据发送到端点，请使用$http或$resource。

查看 Mark Rajcok 对文档的评论：http ://docs.angularjs.org/api/ng.directive:select

于 2013-05-26T19:12:33.947 回答
0

如果您无论如何都需要解决这个问题，并且使用 AngularJS 的良好做法不适用，因为匆忙或需要大量更改，请试试这个（它对我有用）：

<select id="resourceTemp" ng-model="selectedResource">
   <option ng-repeat="r in ['a','b']" value="{{r}}">
      {{r}}
   </option>
</select>

<input type="hidden" name="resourceTemp" ng-value="selectedResource">
于 2017-04-12T16:35:42.187 回答