Javascript AngularJS：如何将视图中指定的模型（ng bind）绑定到通过API可用的$resource？

我正试图通过html视图将同一个数据库对象（在客户端）连接到json API的等效实例

我有一个工作api和$resource，并且有一个工作视图，我只是不知道如何创建绑定，所以视图的更新会更新Angular model/$resource

具体来说，我有一个填充了html视图的服务器端，其中包含一个ngBind属性：

<div class="ng-scope" ng-app="Posts">
  <div class="ng-scope" ng_controller="PostsCtrl">
    <span contenteditable="true" ng-bind="post.1.text">post.1.text value</span>
  </div>
</div>

它成功地填充了一个posts集合（本例中不需要，但显示了API正在工作）

那么，ng bind应该是什么样子，以及如何绑定控制器以获得对写回API的视图的更新

（我知道我可以使用

ng_repeat:“post in posts”

，但请跟我说，我真的很想这样做。“这很复杂”：-）

谢谢

编辑：下面是一个JSFIDLE，大致显示了我试图实现的目标：

---

…但我希望id绑定到对象键“id”，而不是数组中对象的索引。

您的问题有点让人困惑，因此如果我退出，请澄清

我相信你错过的是一个事件，你可以用它来触发你的更新。也许您可以进一步解释UI是如何工作的。用户是否单击按钮提交帖子？是否要根据秒数自动提交？您想在每次更改后提交吗？关于模糊

无论事件/计时器是什么，您都可以在控制器中使用它来触发模型保存（或者您希望对模型执行的任何操作）。因为视图和控制器之间的双向绑定在角度上是自动的（假设您插入了scope模块），所以您只需从视图中引用$scope.post（或其他内容）。您不需要在视图中使用ng绑定或ng范围

希望我没有完全误解你的问题

Darryl具有三种变体，因此您可以看到不同的方法

我使用了更简单的语法进行绑定。我认为使用{{大括号}可以更容易地阅读代码

您的数据设置为数组，因此需要通过数组中的索引引用它。在我对原始代码的修订中，我只是添加了索引。可能没那么有用

John is {{friends[0].name}} and has id {{friends[0].id}}

在代码的下一步，我在js中添加了范围变量，并将它们分配给索引值，以便您可以在视图中使用这些变量名。可能不是您将使用的方法，但只是为了让您了解一些选项

Joy is {{friends[joy].name}} and has id {{friends[joy].id}}

$scope.joy = 1;    // in the javascript

您很可能希望创建一个查找函数，这是您将看到的下一个添加项。在这里，我传入要查找的朋友的id并循环查找匹配项，然后返回整个friend对象。在视图中，我可以引用任何朋友属性。“9”也可以是变量名

Peter is {{getFriend(9).name}} and has id {{getFriend(9).id}}

$scope.getFriend = function(fid) {

    angular.forEach($scope.friends, function(friend, key) {
        if (friend.id == fid) {
            found = friend;
        }
    });
    return found;
};

---

这有助于回答你的问题吗？我最初的回答应该解释更新模型时缺少了什么。

什么是如此复杂，以至于首先构建视图，然后尝试将视图与模型匹配更有意义？当然，您可以使用指令和一些元素遍历来获取索引，但它看起来非常落后，很难测试，而且容易出错。演示将帮助用户定义液体模板。视图的内容未知，但我可以插入ng bind属性来标识包含的资源。考虑到它甚至可以在js发送到客户端之前动态修改它，但我宁愿不要！演示是可行的，但我希望所有相关内容都有问题。

ngbind

将自动填充文本（而不是html）。所以，如果这就是您所需要的…您应该能够通过简单地使用

$index

在控制器作用域数组和元素之间创建一个匹配约定，如果我正确地理解了情况的话。感谢您的响应，但引起我问题的不是触发器，而是绑定。我需要绑定到html中的特定元素。我可以在服务器端向这些元素添加任何属性/值以帮助识别，和/或在客户端添加代码以处理绑定，但这部分我无法理解。我应该补充一点，我是angular的新手，也是js的新手。谢谢！我偶然发现了一个解决方案，它是您的两个解决方案的混合体，迭代数组，并将键作为变量公开：

http://jsfiddle.net/2QfVW/9/

（使用for循环-不知道

angular.forEach

）。但是，虽然它可以使用静态数组，但它不能使用

$resource

，因为迭代器运行时没有加载它。我想我需要回电话，但没走那么远。。。您的finder与$resource完美配合！（必须在forEach之前添加

var found

）。似乎您不能从

forEach

提前返回，那么

for

会更好吗？forEach提供了什么优势？也就是说，不使用大括号的原因是html仍然可以在没有js的情况下工作。js将添加编辑功能（因此内容在原始Q中可编辑）。向上投票并选择正确的答案，但感谢我之前评论中的任何额外提示（或者我应该开始一个新的Q？）。再次感谢！另外，我是否应该编辑原始问题以反映在数组中查找对象键的更一般情况？您肯定必须使用$resource的成功和失败回调。那件事让我有一阵子不舒服。说实话，我只是用它，因为它是有角度的方式。如果您担心性能（appparently for循环是最快的），有些帖子建议您不要这样做。我不清楚你说的牙套是什么意思，但那可能是因为我不知道你的应用程序计划了什么。您应该更新原始问题，因为只有从您的JSFIDLE中我才能理解您想要什么。

Peter is {{getFriend(9).name}} and has id {{getFriend(9).id}}

$scope.getFriend = function(fid) {

    angular.forEach($scope.friends, function(friend, key) {
        if (friend.id == fid) {
            found = friend;
        }
    });
    return found;
};