AngularJS/Express 应用程序中 ngResource 中的“建议 slug 名称”API 调用答案

【问题标题】："Suggest slug name" API call in ngResource in AngularJS/Express appAngularJS/Express 应用程序中 ngResource 中的“建议 slug 名称”API 调用
【发布时间】：2014-05-03 10:53:23
【问题描述】：

我希望用户能够在我的应用程序中为文档设置 slug 名称 (URL)，但我还需要一些控制，这样用户就不会互相覆盖。它需要是一个单独的调用（未与create/update 集成），以便用户可以获得关于他们自己的 slug 名称建议的视觉反馈。

因此，我创建了一个 suggestSlug API 调用，它采用可选的 slug 参数作为最终 slug 名称的种子。

这就是我的 Express 路线的样子：

app.get('/api/projects/suggestSlug/:slug', projects.suggestSlug);
app.get('/api/projects/suggestSlug', projects.suggestSlug);
app.get('/api/projects', projects.list);
app.get('/api/projects/:id', projects.show);

现在，我想在客户端 (AngularJS) 上扩展 ngResource 以使用此 API：

angular.module('myapp.common').factory("projectModel", function ($resource) {
    return $resource(
        "/api/projects/:id",
        { id: "@id" },
        {
            update: { method: "PUT", params: { id: '@_id' } },
            del: { method: "DELETE", params: { id: '@_id' } }
        }
    );
});

如何扩展 ngResource 客户端以使用我的新 API？

【问题讨论】：

标签： angularjs express ngresource

【解决方案1】：

这是我的解决方案：向我的 projectModel 添加一个单独的基于 $http 的方法：

angular.module('myapp.common').factory("projectModel", function ($resource, $http) {

    var projectModel = $resource(
        "/api/projects/:id",
        { id: "@id" },
        {
            update: { method: "PUT", params: { id: '@_id' } },
            del: { method: "DELETE", params: { id: '@_id' } }
        }
    );

    projectModel.suggestSlug = function (slugSuggestion, callback) {
        $http.get(
            '/api/projects/suggestSlug/' + slugSuggestion
            ).success(callback).error(function(error) {
                console.log('suggestSlug error:', error);
            });
    };

    return projectModel;
});

【讨论】：