How to use angular's $resource with TypeScript and d.ts

Question

With this TypeScript (based on some online course):

interface IProduct {
    productName: string
}

interface IProductResource extends ng.resource.IResource<IProduct> {
}

interface IDataAccessService {
    getProductService(): ng.resource.IResourceClass<IProductResource>
}

class DataAccessService implements IDataAccessService {
    static $inject = ['$resource'];

    constructor(private $resource:ng.resource.IResourceService) {
    }

    getProductService():ng.resource.IResourceClass<IProductResource> {
        return this.$resource("sampleUrl");
    }

}

angular.module('app').service('dataAccessService', DataAccessService);

I have a code that uses dataAccessService:

var obj : IProductResource = dataAccessService.getProductService().get();

obj has all angular's REST helper methods like $save/$delete, but I don't have access to interface obj.productName. What is wrong with this code?

Answer 1

I think I got it. It should be:

interface IProductResource
    extends ng.resource.IResource<IProduct>, IProduct {
}

Any comments on that?

Thanks!