Why the port number is cut when angular app call rest service

Question

I have rest service:

http://localhost:3000/api/brands

When I test it from web browser it works well.

I use it in angular service:

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

motoAdsServices.factory('Brand', ['$resource', function($resource) {
    return $resource('http://localhost:3000/api/:id', {}, {
      query: {
        method: 'GET',
        params: {
          id: 'brands'
        },
        isArray: true
      }
    });
  }]);

When it is call I have error because in reqest URL I don't have port number:

Request URL: http://localhost/api/brands

Why the port numer is is cut? Angular cut it?

In Angular doc is written:

A parametrized URL template with parameters prefixed by : as in /user/:username. If you are using a URL with a port number (e.g. http://example.com:8080/api), it will be respected.

UPDATE

I use angular version 1.0.8 (thank @KayakDave for your attention) but Angular doc applies to version 1.2.

Answer 1

It has a colon and therefore gets stripped, kind of like :id. If you escape it, you should be ok. Try http://localhost\:3000/api/:id instead. You may run into this again in routes or other places. There is an issue regarding this behavior in case something changes.

Updated: http://localhost\\:3000/api/:id

Answer 2

Because angular intercept the url and consider the :any as a parameter that you should pass to it.

An easy way to hack this is to put \:3000 in your url.

motoAdsServices.factory('Brand', ['$resource', function($resource) {
    return $resource('http://localhost:3000\:3000/api/:id', {}, {
        query: {
            method: 'GET',
            params: {
                id: 'brands'
            },
            isArray: true
        }
    });
}]);