Быстрый и простой ответ - использовать $ rootScope. $ rootScope доступен для всех контроллеров, но, как и все глобальные переменные, следует использовать экономно.

Вот хороший пост, объясняющий $ rootScope. http://www.dotnet-tricks.com/Tutorial/angularjs/UVDE100914-Understanding-AngularJS- $ rootScope-and- $ scope.html

В основном, если вы используете его на двух контроллерах для страниц x и y

app.controller('login',['$scope','$rootScope', function ($scope,$rootScope) {
    $rootScope.foo='bar';
}]);

app.controller('xCtrl',['$scope','$rootScope', function ($scope,$rootScope) {
    $scope.lorem=$rootScope.foo;
    console.log($scope.lorem); //bar
}]);

app.controller('yCtrl',['$scope','$rootScope', function ($scope,$rootScope) {
    $scope.ipsum=$rootScope.foo;
    console.log($scope.ipsum); //bar
}]);

Можете затем использовать их в своей разметке HTML как обычно.

Использование $ rootScope намного проще, но если вы хотите использовать маршрутизатор для вытаскивания идентификатора каждый раз, это также возможно.

app.config(function($routeProvider){
    $routeProvider
     .when('/',{
        controller: 'indexController',
        templateUrl: 'view/index.html'
     })
     .when('/:id/about',{
        controller: 'xCtrl',
        templateUrl: 'view/x.html'
     })
    .otherwise({
        redirectTo: '/'
    });
});

app.controller('xCtrl',['$scope','$routeParams', function($scope,$routeParams){
    $scope.foo=$routeParams.id;
}]);

Если у вас гораздо больше страниц, чем просто, я мог бы представить, что это немного сложно с маршрутизацией.

Вы даже можете связать его с корневой областью, а затем передать ее другим контроллерам.

app.controller('xCtrl',['$scope','$rootScope','$routeParams', function($scope,$rootScope,$routeParams){
    $rootScope.foo=$routeParams.id;
    $scope.lorem=$rootScope.foo;
}]);

--EDIT на основе comment-- Мне может понадобиться код, чтобы быть уверенным, что вы после, но, возможно, это разъясняет?

URL: mysite.com/blue/about

app.config(function($routeProvider){
    $routeProvider
     .when('/',{
        controller: 'indexController',
        templateUrl: 'view/index.html'
     })
     .when('/:id/about',{
        controller: 'xCtrl',
        templateUrl: 'view/x.html'
     })
    .otherwise({
        redirectTo: '/'
    });
});

app.controller('xCtrl',['$scope','$routeParams', function($scope,$routeParams){
    $scope.theme=$routeParams.id;
}]);

HTML

<div ng-controller="xCtrl">
    <div ng-class="{{theme}}">
        My theme is {{theme}}.
    </div>
</div>

CSS

.blue
{
    background-color: blue;
}
.green
{
    background-color: green;
}