ViewService | @uirouter/angularjs
Options
Menu

Class ViewService

The View service

This service pairs existing ui-view components (which live in the DOM) with view configs (from the state declaration objects: StateDeclaration.views).

Hierarchy

  • ViewService

Index

Methods

Object literals

Methods

  • activateViewConfig(viewConfig: ViewConfig): void

  • Parameters

    Returns void

  • active(): any[]

  • Returns the list of views on the page containing loaded content.

  • Returns the list of views on the page containing loaded content.

    Returns any[]

    :

    Returns an array of fully-qualified view names.

  • available(): any[]

  • Returns the list of views currently available on the page, by fully-qualified name.

  • Returns the list of views currently available on the page, by fully-qualified name.

    Returns any[]

    :

    Returns an array of fully-qualified view names.

  • Parameters

    Returns ViewConfig[]

  • deactivateViewConfig(viewConfig: ViewConfig): void

  • Deactivates a ViewConfig.

  • Deactivates a ViewConfig.

    This function deactivates a ViewConfig. After calling sync, it will un-pair from any ui-view with which it is currently paired.

    Parameters

    • viewConfig ViewConfig
      :

      The ViewConfig view to deregister.

    Returns void

  • registerUIView(uiView: ActiveUIView): (Anonymous function)

  • Registers a ui-view component

  • Registers a ui-view component

    When a ui-view component is created, it uses this method to register itself. After registration the sync method is used to ensure all ui-view are configured with the proper ViewConfig.

    Note: the ui-view component uses the ViewConfig to determine what view should be loaded inside the ui-view, and what the view's state context is.

    Note: There is no corresponding deregisterUIView. A ui-view should hang on to the return value of registerUIView and invoke it to deregister itself.

    Parameters

    Returns (Anonymous function)

    :

    a de-registration function used when the view is destroyed.

  • sync(): void

  • Returns void

  • Given a ui-view and a ViewConfig, determines if they "match".

    A ui-view has a fully qualified name (fqn) and a context object. The fqn is built from its overall location in the DOM, describing its nesting relationship to any parent ui-view tags it is nested inside of.

    A ViewConfig has a target ui-view name and a context anchor. The ui-view name can be a simple name, or can be a segmented ui-view path, describing a portion of a ui-view fqn.

    In order for a ui-view to match ViewConfig, ui-view's $type must match the ViewConfig's $type

    If the ViewConfig's target ui-view name is a simple name (no dots), then a ui-view matches if:

    • the ui-view's name matches the ViewConfig's target name
    • the ui-view's context matches the ViewConfig's anchor

    If the ViewConfig's target ui-view name is a segmented name (with dots), then a ui-view matches if:

    • There exists a parent ui-view where:
      • the parent ui-view's name matches the first segment (index 0) of the ViewConfig's target name
      • the parent ui-view's context matches the ViewConfig's anchor
    • And the remaining segments (index 1..n) of the ViewConfig's target name match the tail of the ui-view's fqn

    Example:

    DOM:

    uiViews: [ { fqn: "$default", creationContext: { name: "" } }, { fqn: "$default.foo", creationContext: { name: "A" } }, { fqn: "$default.foo.$default", creationContext: { name: "A.B" } } { fqn: "$default.foo.$default.bar", creationContext: { name: "A.B.C" } } ]

    These four view configs all match the ui-view with the fqn: "$default.foo.$default.bar":

    • ViewConfig1: { uiViewName: "bar", uiViewContextAnchor: "A.B.C" }
    • ViewConfig2: { uiViewName: "$default.bar", uiViewContextAnchor: "A.B" }
    • ViewConfig3: { uiViewName: "foo.$default.bar", uiViewContextAnchor: "A" }
    • ViewConfig4: { uiViewName: "$default.foo.$default.bar", uiViewContextAnchor: "" }

    Using ViewConfig3 as an example, it matches the ui-view with fqn "$default.foo.$default.bar" because:

    • The ViewConfig's segmented target name is: [ "foo", "$default", "bar" ]
    • There exists a parent ui-view (which has fqn: "$default.foo") where:
      • the parent ui-view's name "foo" matches the first segment "foo" of the ViewConfig's target name
      • the parent ui-view's context "A" matches the ViewConfig's anchor context "A"
    • And the remaining segments [ "$default", "bar" ].join("."_ of the ViewConfig's target name match the tail of the ui-view's fqn "default.bar"

    Parameters

    Returns (Anonymous function)

  • normalizeUIViewTarget(context: ViewContext, rawViewName?: string): object

  • Normalizes a view's name from a state.views configuration block.

  • Normalizes a view's name from a state.views configuration block.

    This should be used by a framework implementation to calculate the values for _ViewDeclaration.$uiViewName and _ViewDeclaration.$uiViewContextAnchor.

    Parameters

    • context ViewContext
      :

      the context object (state declaration) that the view belongs to

    • rawViewName: Default value  string = ""
      :

      the name of the view, as declared in the StateDeclaration.views

    Returns object

    :

    the normalized uiViewName and uiViewContextAnchor that the view targets

    • uiViewContextAnchor: string
    • uiViewName: string

Object literals

_pluginapi: object
_rootViewContext: any = this._rootViewContext.bind(this)
_viewConfigFactory: any = this._viewConfigFactory.bind(this)
  • _activeViewConfigs(): ViewConfig[]

  • Returns ViewConfig[]

  • Parameters

    Returns (Anonymous function)

  • Parameters

    • id string

    Returns ActiveUIView

  • _registeredUIViews(): ActiveUIView[]

  • Returns ActiveUIView[]

Generated using TypeDoc