在angular $ resource上添加自定义函数

You*_*wad 21 javascript angularjs angularjs-scope angularjs-resource

我有一个像这样的角度资源

app.factory('User', function ($resource) {
    return $resource(
        '/api/user/:listCtrl:id/:docCtrl/', {
            id: '@id',
            listCtrl: '@listCtrl',
            docCtrl: '@docCtrl'
        }, {
            update: {
                method: 'PUT'
            },
            current: {
                method: 'GET',
                params: {
                    listCtrl: 'current'
                }
            },
            nearby: {
                method: 'GET',
                params: {
                    docCtrl: 'nearby'
                },
                isArray: true
            }
        }
    );
});
Run Code Online (Sandbox Code Playgroud)

现在我想在视图中有全名,我可以添加一个方法,这样当我这样做

$scope.user = User().current();
Run Code Online (Sandbox Code Playgroud)

而不是在HTML中执行以下操作

<p>{{ user.first_name }} {{ user.last_name }}</p>
Run Code Online (Sandbox Code Playgroud)

我这样做

<p>{{ user.get_full_name }}</p>
Run Code Online (Sandbox Code Playgroud)

有没有办法将此属性添加到$resource

Jer*_*err 56

您可以使用transformResponse将其添加为属性,但我可以建议只为每个返回组合名和姓的对象添加一个方法:

app.factory('User', function ($resource) {
    var User = $resource(
        '/api/user/:listCtrl:id/:docCtrl/', {
            id: '@id',
            listCtrl: '@listCtrl',
            docCtrl: '@docCtrl'
        }, {
            update: {
                method: 'PUT'
            },
            current: {
                method: 'GET',
                params: {
                    listCtrl: 'current'
                }
            },
            nearby: {
                method: 'GET',
                params: {
                    docCtrl: 'nearby'
                },
                isArray: true
            }
        }
    );
    // add any methods here using prototype
    User.prototype.get_full_name = function() {
        return this.first_name + ' ' + this.last_name;
    };
    return User;
});
Run Code Online (Sandbox Code Playgroud)

然后使用:

<p>{{ user.get_full_name() }}</p>
Run Code Online (Sandbox Code Playgroud)

使用原型添加的任何函数都将添加到您的服务返回的每个对象上.如果您需要复杂地获取或设置服务属性,这是添加辅助方法的好方法.


You*_*wad 5

在使用角度玩了一段时间后,我认为客户过滤器将是一种更明智的方法,而不是在$ resource上添加属性.

这里是如何做一个过滤器

app.filter('getFullName', function () {
    return function (input) {
      if (input) {
        return input.first_name + ' ' + input.last_name;
      } else {
        return 'default';
      }
    };
  });
Run Code Online (Sandbox Code Playgroud)