acessando o URL da instância $ Resource em angularjs

Question

Criei uma instância de recurso com este código:

$scope.book = Book.get({bookId:1});

Aqui está o código de serviço:

var bookServices=angular.module('bookServices',['ngResource']);

bookServices.factory('Book',['$resource',
    function($resource){
        return $resource('/books/:bookId',{},{});
    }]);

O livro possui imagem de capa, acessível pela url:/books/:bookId/cover.png

Como posso obter o URL da instância do recurso?

$scope.book.$$url 

é indefinido.

Answer 1

Acho que esta é uma preocupação de visão e deve ser tratada aí.Não posso testar isso agora, mas meu palpite seria construir o URL no seu modelo de visualização.

Então, o modelo de detalhes do livro seria:

<div>
     <p>Name: {{ book.name }}</p>         
     <img ng-src="/books/{{ book.id }}/cover.png" alt="cover">
</div>

Talvez você precise brincar com o caminho relativo, mas isso deve resolver.Você deseja manter essas preocupações fora do seu controlador e serviços, e o angular vem com muitas ferramentas, como o diretiva ngSrc, para fazer exatamente isso.

EDITAR

Talvez para responder melhor à pergunta original, aqui está outra solução.Use o padrão decorador para ampliar a API do serviço $resource para expor o URL como uma propriedade de um objeto de recurso.

Decore o serviço $resource assim:

function ResourceDecorator($delegate) {

  var decorator = function (url, paramDefaults, actions) {

    var resource = $delegate(url, paramDefaults, actions),
        getSave;

    // expose the parameterized url of the resource
    resource.$url = url;

    // expose urls for individual resources by extending
    // the get method to return a class object that has
    // a url property

    getSave = resource.get;

    resource.get = function(parameters, success, error) {

      var r = getSave(parameters, success, error),
              paramName;

      // get the name of the parameter, assuming just ONE            
      paramName = Object.keys(parameters)[0];

      // replace the parameter with it's value
      r.$url = url.replace(':' + paramName, parameters[paramName]);

      // return the decorated class object back
      return r;
    };

    return resource;

  };

  return decorator;

}

app.config(['$provide', function ($provide) {

    $provide.decorator('$resource', ['$delegate', ResourceDecorator]);

}]);

Então você terá o URL disponível como uma propriedade no seu objeto de recurso.

$scope.book.$url

Observe que há uma série de cenários de $resource que este exemplo simples não suporta, mas mostra uma prova de conceito.

Ver esse plunker.