如何使用 AngularJS 和 Restangular 返回/编辑 REST 资源

Posted

技术标签:

【中文标题】如何使用 AngularJS 和 Restangular 返回/编辑 REST 资源【英文标题】:How to return/edit REST resource with AngularJS & Restangular 【发布时间】:2013-06-19 16:49:38 【问题描述】:

在AngularJS中使用Restangular,不断从Mongolab获取一个object对象。

我确信它与 Promise 有关,但不确定如何使用/实现它来自旧的 Java OO 经验。

(旁注,像 Eloquent javascript 这样的书籍或资源可以帮助我理解“新”Javascript 风格吗?)

这个小型网络应用程序是为残疾学生设计的,用于输入/编辑学生,更新他们放学后的时间,然后每周为他们的父母/看护人输出报告。

这是弹出新表单时返回 undefined 的代码(AngularJS Boostrap UI modal)

我个人认为 Restangular 和文档是一个很好的补充,所以希望它不会劝阻其他人 - 这只是我不够了解。

提前致谢

app.js ...

$scope.editStudent = function(id) 
    $scope.myStudent = Restangular.one("students", id);
    console.log($scope.myStudent);

【问题讨论】:

我可能会使用 ngResource 而不是 restangular。另外,是的 - 有一些很好的 JS 书籍,比如 Eloquent JavaScript 会帮助你入门。还有一些关于 AngularJS 的好书。祝你好运! 请求的构建是否正确,即点击了正确的 url?尝试在浏览器中使用 firebug 或其他 javascript 控制台并检查该流量。至于 ngResource 与 Restangular,Restangular 确实有它的优点:github.com/mgonto/restangular/blob/master/…(承诺部分不再正确) 感谢 Benjamin & Maarten 迄今为止的意见。 Maarten:是的,它正在访问 URL,至少我的 getList 可以获取残疾学生的列表。这是一个很棒的库和很棒的文档,只是我太密集了哈哈。 嘿@Maarten 确实,承诺部分“现在有点真实”。在我看来,$resource 上的 $promise 实现仍然很糟糕。它仍然对您的对象进行这种“魔术”填充,并且您必须将 $promise 作为响应的真实对象或数组的属性。我更喜欢自己回报承诺。 @mgonto 必须相信你。我们正在使用restangular fwiw 【参考方案1】:

我是 Restangular 的创造者 :)。也许我可以帮助你一点。

因此,您需要做的第一件事是为 Restangular 配置 baseUrl。对于 MongoLab,您通常确实有一个与所有这些类似的基本 url。

一旦你得到这个工作,你需要检查响应的格式:

如果您的响应包含在另一个对象或信封中,您需要在您的 responseExtractor 中“解包”它。为此,请查看https://github.com/mgonto/restangular#my-response-is-actually-wrapped-with-some-metadata-how-do-i-get-the-data-in-that-case

一旦你确定了,你就可以开始做请求了。

所有 Restangular 请求都返回一个 Promise。 Angular 的模板能够处理 Promises,并且能够在 html 中显示 Promise 结果。因此,如果 promise 尚未解决,它不会显示任何内容,一旦您从服务器获取数据,它就会显示在模板中。

如果你想做的是编辑你得到的对象然后做一个 put,在这种情况下,你不能使用 Promise,因为你需要更改值。

如果是这种情况,您需要将 promise 的结果分配给 $scope 变量。

为此,您可以这样做:

Restangular.one("students", id).get().then(function(serverStudent) 
    $scope.myStudent = serverStudent;
);

这样,一旦服务器返回学生,您将把它分配给范围变量。

希望这会有所帮助!否则在这里评论我!

也可以看看这个 MongoLab 的例子,也许它会帮助你:)

http://plnkr.co/edit/d6yDka?p=preview

【讨论】:

嘿,restangular 的创造者! :) 你能看看我关于put-issue 的非常相关的问题吗?

以上是关于如何使用 AngularJS 和 Restangular 返回/编辑 REST 资源的主要内容,如果未能解决你的问题,请参考以下文章

如何使用 AngularJS 和 Restangular 返回/编辑 REST 资源

AngularJS:如何使用 ngResource 处理成功和错误回调?

如何使用angularJs

如何使用 Express、AngularJS、Socket.io 广播和获取通知?

如何查看angularjs版本

AngularJS中如何使用属性前缀“x-”和“data-”