@ovh-ux/ng-ui-router-layout NPM

ng-ui-router-layout

Enhance UI-Router by adding a layout decorator.

Install

$ yarn add @ovh-ux/ng-ui-router-layout

Usage

`modal` layout

This layout is now deprecated. Prefer using ouiModal layout.

// index.js
import angular from 'angular';
import ngUiRouterLayout from '@ovh-ux/ng-ui-router-layout';

angular.module('myApp', [ngUiRouterLayout]);

With controller and template

// routing.js
import controller from './controller';
import template from './template.html';

$stateProvider.state('state.name', {
  url,
  views: {
    modal: {
      controller,
      template,
    },
  },
  layout: 'modal',
});

With component

// routing.js
$stateProvider.state('state.name', {
  url,
  views: {
    modal: {
      component: 'awesomeModal',
    },
  },
  layout: 'modal',
});

With a component provider

// routing.js
$stateProvider.state('state.name', {
  url,
  views: {
    modal: {
      componentProvider: (predicate) =>
        predicate
          ? 'awesomeModalForTruePredicate'
          : 'awesomeModalForFalsePredicate',
    },
  },
  layout: 'modal',
});

`ouiModal` layout

See ouiModal layout.

Test

$ yarn test

@ovh-ux/ng-ui-router-breadcrumb - Display a breadcrumb based on the UI-Router state declaration
@ovh-ux/ng-ui-line-progress - Display a line progress between UI-Router transition hooks

Contributing

Always feel free to help out! Whether it's filing bugs and feature requests or working on some of the open issues, our contributing guide will help get you started.