如何使用业务逻辑扩展已解析的$资源

Question

我有以下情况

服务：

.factory(
    'itemsApi',
    function($resource) {
        return $resource("/api/items/:id", { id: "@_id" }, {
            'create': { method: 'POST' },
            'get': { method: 'GET', isArray: false },
            'update': { method: 'PUT' }
        });
    })

路由器

$routeProvider
    .when("/item/:id", {
        templateUrl: "item.tpl.html",
        controller: "ItemController",
        resolve: {
           item: ['$route', 'itemsApi', function ( $route, itemsApi) {
                return itemsApi.get({ id: $route.current.params.id });
            }]
        }
    }
})

控制器

.controller('ItemController',['$scope','item', function($scope, item) {
    $scope.item = item;
}

到目前为止一切正常。我的控制器里有这个项目。现在我想用我的业务逻辑扩展$scope.item。

业务逻辑

function Item() {}

Item.prototype.totalPrice = function() {
   // $scope.item should be here 'this'
   return this.price + this.shipping;
}

目标：

使用Angular Way中的业务逻辑扩展$scope.item。

我尝试使用angular.extend但不起作用。 $ scope.item没有totalPrice函数。

例如： in controller

$scope.item = angular.extend(item, new Item());

问题

我如何优雅地$scope.item包含Item类的方法？

---

修改

@ryeballar提出的解决方案产生了难看的效果。

现在＆＃39; $ scope.item＆＃39;将$资源包装在＆＃39; $ scope.item.item＆＃39;

中

所以我应该更改文档中的每个绑定路径。

从

<span ng-bind="item.price"></span>

到

<span ng-bind="item.item.price"></span>

这对我来说是不可接受的，感觉不好练习。然后我想到了这个解决方案

项目构造函数

var Item = function Item(item) {
    // mixing
    angular.extend(this, item);
};

这解决了最后一个问题但产生了新问题。

现在$scope.item不包含$resource方法。 （例如$scope.item.update()）从__proto__到Resourse Item到期{/ 1}}

最后

虽然$socpe.item不再有update和create方法。可以使用itemApi代替。

if ($scope.item._id) {
    itemsApi.update({ id: $scope.item._id}, $scope.item)
            .$promise.then(function(item) {
                    $scope.item = new Indoor(item);                       
            });
} else {
    itemsApi.create($scope.item)
            .$promise.then(function(item) {
                    $scope.item= new Indoor(item);
             });
}

Answer 1

为您的Item模型创建工厂服务并将其注入您的决心，然后将已解析的值作为Item对象返回。

项目服务

.factory('Item', function() {
  var Item = function(item) {
    this.item = item;
  };

  Item.prototype.totalPrice = function() {
    return this.item.price + this.item.shipping;
  };

  return Item;
});

<强>路由器

$routeProvider
    .when("/item/:id", {
        templateUrl: "item.tpl.html",
        controller: "ItemController",
        resolve: {
           item: ['$route', 'itemsApi', 'Item', function ( $route, itemsApi, Item) {
                return itemsApi.get({ id: $route.current.params.id })
                  .$promise.then(function(item) {
                    return new Item(item);
                  });
            }]
        }
    }
});

<强>控制器

.controller('ItemController', ['$scope', 'item', function($scope, item) {
  $scope.item = item; // this is an Item Object
}]);

<强> HTML

{{item.totalPrice()}}