4

I use Angular $resource service and it's not clear for me why there is two different methods for main queries.

I can do this:

var House = $resource('/house/:uuid', {}); // create resource
var houseUuid = '123';
var house = new House.get({uuid: houseUuid}); // create resource instance

...and then in my controller:

$scope.house = house; // after get request to server data will be putted to model

BUT

There is strange $get method in resource instance

house.$get(...) // what is $get?

What is the difference? How can I use them? What is main usecase of $get method?

Shashank Agrawal
  • 25,161
  • 11
  • 89
  • 121
WebBrother
  • 1,447
  • 20
  • 31

1 Answers1

4

The 5 common methods get, save, query, remove and delete are available in the $resource class which can be invoked directly over the House class.

While save, remove and delete methods can be accessed with the $ prefix on the instance of House class/resource which allows us to easily perform the CRUD operation on any instance.

Compare this with Java method i.e. all 5 methods without the $ are static methods in Java while all 3 (save, remove and delete) with $ prefix are instance level method.

Consider the example:

// Define a class/resource
var House = $resource('/house/:uuid', {});

// Get an instance
var houseInstance = Hourse.get({uuid: "xyz"});

// Delete the instance on any event like click using the `$` prefix (which works directly on the instance)
houseInstance.$delete()

// Or delete that instance using the class:
House.delete({uuid: houseInstance.uuid});

Similarly for other methods like save and remove. I'm not sure if the $get method will be available because that is really not needed. If you think in the MVC architecture, why will you need an instance method to get a single record over an instance.

Similarly, you can define your own custom instance and class (static) level methods:

var House = $resource('/house/:uuid', {}, {
    foo: {
         method: "POST",
         url: "/house/show/:uuid"
    },
    update: {
        method: "PUT"
    }
});

Now you can call:

House.foo({uuid: "xyz"}, {houseNumber: "1234"});

// Or you can write this:

var house = new House();
house.uuid = "xyz";
house.houseNumber = "1234";
house.$foo();
// Or any custom method
house.$update();

Feel free to use any of the approach i.e. (class or instance level action) anywhere but I recommend using the instance level (i.e. with $ prefix) where you have multiple instance of House (or any resource) like in a listing page of Houses.

So, if you are iterating over hundreds of House instance you can easily provide the option to delete a House if you use the instance action. For example:

Using instance action (recommended in this example):

<div ng-repeat="house in houses">
    {{house.name}}
    <a href="house.$delete()">Delete this house</a>
</div>

But you can also use the class level action in this case (which is not recommended in this example)

Using class action (not recommended in this example):

<div ng-repeat="house in houses">
    {{house.name}}
    <a href="deleteHouse(house.uuid)">Delete this house</a>
</div>

In your controller:

$scope.deleteHouse = function(uuid) {
    House.delete({uuid: uuid});
};

This is just the plain simple example which demonstrate a use-case of when to use instance action v.s. class action and it clearly states that using instance action in the above example will be cleaner.

Shashank Agrawal
  • 25,161
  • 11
  • 89
  • 121