Question

下面代码中的“myData”是一个json对象，我从$ http.get响应中提取（我在初始化web应用程序时调用了请求）。用户必须能够更改数据，因此我使用在此对象中填充值的输入创建了下面的代码。

<div ng-repeat="(parameter,value) in myData">
    <p>{{parameter}}</p>
    <!-- show only if val is defined (not 0 or null) -->
    <div ng-repeat="(par,val) in value" ng-show="val">
        <p>{{par}} : <input type="text" value={{val}}></p> <!-- val is the value the user can change, and par is  the parameter name such as in { parameter: "value" } -->
    </div>
</div>

我创建了用户在想要保存更改数据时可以单击的按钮（ng-click =“saveData（）”）。

saveData函数然后可以使用$ http.put（url，data）在某处更新数据...

我不知道如何将整个对象传递给saveData（）函数？我知道你可以通过像saveData（myVariableOrObject）那样添加它来传递所有内容，但我不知道在我的情况下我会怎么做。

可能我在这里遗漏了一些东西，因为我对angularJS很新。我的html输入是否应该有某种ng-model那样会以某种方式将值连接到控制器？我可能会想到这一点，但对于整个对象，嗯？我是否需要再次在控制器函数中构造对象或者是否有更简单的方法？

如果有人能指出我正确的方向，我会很高兴。

如果我不清楚，请询问更多信息。

谢谢！

Answer 1

我认为ng-form是一个很好的解决方案： http://docs.angularjs.org/guide/forms

Answer 2

<input type="text" ng-model="myData[parameter][par]">

Answer 3

我写了一个快速的JSFiddle，你可以在这里查看：http://jsfiddle.net/jakemulley/3AK79/1/

如您所见，'数据'与两个输入上的ng-model属性相关联，这意味着您不需要value={{val}}。

另外，值得注意的是，表单可以具有ng-submit属性，该属性在提交表单时调用函数（在本例中为save(user)）。

注1：此处提供的数据可以替换为您的http.get数据。

注2：通过'用户'，您可以获得用户名和显示名称，您可以将其作为数据发布到http.put。

这有帮助吗？

Answer 4

首先，ng-onclick不是ng-click。

其次，{{val}}表达式是单向绑定。这意味着输入标记内的更改不会影响val变量。您将需要使用ng-model进行双向绑定。之后，您可以轻松ng-click="saveData(myData)"或仅ng-click="saveData()"并使用$ scope.myData获取控制器内的值。

AngularJS：使用输入字段更改json对象值（例如，使用ng-click）

4 个答案: