The reference to the component currently inside the viewport
Deregisters the ui-view from the view service
Deregisters the master uiCanExit transition hook
Deregisters the master uiOnParamsChanged transition hook
Data about the this UIView
the UI-Router state that is filling this uiView, or undefined.
Supplies component inputs with resolve data
Supplies component inputs with resolve data
Finds component inputs which match resolves (by name) and sets the input value to the resolve data.
Creates a new Injector for a routed component.
Creates a new Injector for a routed component.
Adds resolve values to the Injector Adds providers from the NgModule for the state Adds providers from the parent Component in the component tree Adds a PARENT_INJECT view context object
an Injector
For each transition, checks the component loaded in the ui-view for:
For each transition, checks the component loaded in the ui-view for:
If both are true, adds the uiCanExit component function as a hook to that singular Transition.
For each transition, checks if any param values changed and notify component
For each transition, checks if any param values changed and notify component
The view service is informing us of an updated ViewConfig (usually because a transition activated some state and its views)
The view service is informing us of an updated ViewConfig (usually because a transition activated some state and its views)
Generated using TypeDoc
A UI-Router viewport directive, which is filled in by a view (component) on a state.
Selector
A
ui-viewdirective can be created as an element:<ui-view></ui-view>or as an attribute:<div ui-view></div>.Purpose
This directive is used in a Component template (or as the root component) to create a viewport. The viewport is filled in by a view (as defined by a Ng2ViewDeclaration inside a Ng2StateDeclaration) when the view's state has been activated.
Example:
// This app has two states, 'foo' and 'bar' stateRegistry.register({ name: 'foo', url: '/foo', component: FooComponent }); stateRegistry.register({ name: 'bar', url: '/bar', component: BarComponent });<!-- This ui-view will be filled in by the foo state's component or the bar state's component when the foo or bar state is activated --> <ui-view></ui-view>Named ui-views
A
ui-viewmay optionally be given a name via the attribute value:<div ui-view='header'></div>. Note: an unnamedui-viewis internally named$default. When aui-viewhas a name, it will be filled in by a matching named view.Example:
stateRegistry.register({ name: 'foo', url: '/foo', views: { header: HeaderComponent, $default: FooComponent });<!-- When 'foo' state is active, filled by HeaderComponent --> <div ui-view="header"></div> <!-- When 'foo' state is active, filled by FooComponent --> <ui-view></ui-view>