javascript - Angular - 使用自定义方法扩展 $resource 子对象

标签 javascript angularjs angularjs-resource

在大多数情况下 <custom-resource>.query() 的结果method 是一个数组,可以使用以下(工厂)代码使用一些方法(业务逻辑)轻松扩展它:

var Data = $resource('http://..');
Data.prototype.foo = function() {return ...};

这非常适合与 ng-repeat/ng-class 一起使用,如下所示:

<tr ng-repeat="item in responseData" ng-class="{warning: item.foo()}">..</tr>

我的问题是每个列表响应都被封装在一个对象中,除了实际列表之外,该对象还有一些元属性(排序信息等),所以返回的最终对象是这样的:

{ order_field: "name", items: [{..}, {..},{..}] }

现在,如何使用 ng-repeat/ng-class 制作与之前相同的东西?

<tr ng-repeat="item in responseData.items" ng-class="????">..</tr>

之前的方法将不起作用,因为“foo”方法定义在 responseData 上而不是 item对象

有没有办法直接扩展用于实例化列表中对象的基类?

谢谢!

最佳答案

我以前发现过这个问题,解决方案似乎是 transformResponse,正如 John Ledbetter 在另一个答案中所说的那样。

无论如何,如果您需要保留整个对象,并且还要让“items”中的数组充满资源实例,您可以使用以下技巧来实现:

以 John 的回答为例,稍微修改一下:

angular.module('foo')

  .factory('Post', ['$resource', function($resource) {

    var Post = $resource('/api/posts/:id', { id: '@id' }, {
      query: {
        method: 'GET',
        isArray: false, // <- not returning an array
        transformResponse: function(data, header) {
          var wrapped = angular.fromJson(data);
          angular.forEach(wrapped.items, function(item, idx) {
             wrapped.items[idx] = new Post(item); //<-- replace each item with an instance of the resource object
          });
          return wrapped;
        }
      }
    });

    Post.prototype.foo = function() { /* ... */ };

    return Post;
  }]);

关于javascript - Angular - 使用自定义方法扩展 $resource 子对象,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/17134401/

相关文章:

javascript - 防止用户在 Datepicker 文本框中输入无效的日期格式而不禁用它

javascript - 为什么在html中添加类名后我的图像不显示?

javascript - 页面加载时的默认菜单选择

asp.net-mvc - 使用 AngularJS 和 MVC.NET 处理 $resource

javascript - 如果 JSON 数据为空则发出警报 - 代码不起作用

javascript - 我能以某种方式在第一个 `then` 中获得 fetch 响应吗?

javascript - 组合/扩展/"subclassing"Angular 指令?

jquery - 如何使用 AngularJS 将 div 向左滚动

javascript - 如何将 JSON 对象传递给 angularjs 中的资源

javascript - 初始化后设置 $resource transformResponse