Skip to main content

Overview

An instance of UI-Router. This object contains references to service APIs which define your application’s routing behavior.

Properties

trace

trace
Trace
Enable/disable tracing to the javascript console for debugging purposes.
router.trace.enable('TRANSITION');

viewService

viewService
ViewService
Provides services related to ui-view synchronization

globals

globals
UIRouterGlobals
An object that contains global router state, such as the current state and params
const currentState = router.globals.current;
const currentParams = router.globals.params;
See UIRouterGlobals for detailed documentation.

transitionService

transitionService
TransitionService
A service that exposes global Transition Hooks
router.transitionService.onStart({}, (transition) => {
  console.log('Transition started');
});

urlService

urlService
UrlService
Provides services related to the URL
router.urlService.url('/home');

stateRegistry

stateRegistry
StateRegistry
Provides a registry for states, and related registration services
router.stateRegistry.register({
  name: 'home',
  url: '/home',
  component: HomeComponent
});

stateService

stateService
StateService
Provides services related to states
router.stateService.go('home');

locationService

locationService
LocationServices
Handles low level URL read/write operations

locationConfig

locationConfig
LocationConfig
Returns low level URL configuration and metadata

Methods

plugin()

Adds a plugin to UI-Router. A plugin can enhance or change UI-Router behavior using any public API.
plugin<T extends UIRouterPlugin>(
  plugin: { new (router: UIRouter, options?: any): T },
  options?: any
): T
plugin
UIRouterPlugin | PluginFactory
required
One of:
  • A plugin class which implements UIRouterPlugin
  • A constructor function for a UIRouterPlugin which accepts a UIRouter instance
  • A factory function which accepts a UIRouter instance and returns a UIRouterPlugin instance
options
any
Options to pass to the plugin class/factory
Returns: The registered plugin instance

Example: Basic Plugin

import { MyCoolPlugin } from 'ui-router-cool-plugin';

const plugin = router.plugin(MyCoolPlugin);

Example: Plugin Authoring

A plugin is simply a class (or constructor function) which accepts a UIRouter instance and (optionally) an options object.
export class MyAuthPlugin implements UIRouterPlugin {
  name = 'MyAuthPlugin';

  constructor(router: UIRouter, options: any) {
    const $transitions = router.transitionService;
    const $state = router.stateService;

    const authCriteria = {
      to: (state) => state.data && state.data.requiresAuth
    };

    function authHook(transition: Transition) {
      const authService = transition.injector().get('AuthService');
      if (!authService.isAuthenticated()) {
        return $state.target('login');
      }
    }

    $transitions.onStart(authCriteria, authHook);
  }
}

getPlugin()

Returns a plugin registered with the given pluginName, or all registered plugins.
getPlugin(): UIRouterPlugin[]
getPlugin(pluginName: string): UIRouterPlugin
pluginName
string
The name of the plugin to get (optional)
Returns: The plugin, or array of all plugins if no name provided

Example

// Get specific plugin
const myPlugin = router.getPlugin('MyAuthPlugin');

// Get all plugins
const allPlugins = router.getPlugin();

disposable()

Registers an object to be notified when the router is disposed.
disposable(disposable: Disposable): void
disposable
Disposable
required
An object with a dispose(router: UIRouter) method

Example

const myService = {
  dispose(router) {
    // Clean up resources
  }
};

router.disposable(myService);

dispose()

Disposes this router instance. When called, clears resources retained by the router by calling dispose(this) on all registered disposable objects.
dispose(disposable?: any): void
disposable
any
Optional: If provided, calls dispose(this) on that object only

Example

// Dispose entire router
router.dispose();

// Dispose specific object
router.dispose(myService);

Constructor

Creates a new UIRouter object.
constructor(
  locationService?: LocationServices,
  locationConfig?: LocationConfig
)
locationService
LocationServices
A LocationServices implementation (defaults to stub)
locationConfig
LocationConfig
A LocationConfig implementation (defaults to stub)

Example

import { UIRouter } from '@uirouter/core';
import { pushStateLocationService } from '@uirouter/core';
import { browserLocationConfig } from '@uirouter/core';

const router = new UIRouter(
  pushStateLocationService,
  browserLocationConfig
);

Deprecated Properties

urlMatcherFactory

Deprecated for public use. Use urlService instead.
urlMatcherFactory
UrlMatcherFactory
Legacy URL matcher factory

urlRouter

Deprecated for public use. Use urlService instead.
urlRouter
UrlRouter
Legacy URL router

UIRouterPlugin

interface UIRouterPlugin extends Disposable {
  name: string;
}

Disposable

interface Disposable {
  dispose(router?: UIRouter): void;
}

PluginFactory

type PluginFactory<T> = (router: UIRouter, options?: any) => T;

Build docs developers (and LLMs) love