Nested modules structure

[sadiqhabib]

Hi Thank you so much for this amazing seed. But I am little bit confused about nested modules that how should I define them. e.g I have

• User
  • Register
  • Signin
  • Forgot Password
  • Reset Password
  • e.t.c

Can you please help me her to define these modules. Thank you

[adamreisnz]

Hi, thanks for using the seed. I need to update this seed a bit, and will add some example nested routes while I'm at it. But quite busy at the moment with other projects so it might take a few weeks.

But in general you're free to use what structure you'd like. My usual way of defining nested routes is something along these lines:

Member

/**
 * Config
 */
.config($stateProvider => {
  $stateProvider.state('member', {
    url: '/members',
    abstract: true,
    template: '<ui-view/>',
  });
})

Member overview

/**
 * Config
 */
.config($stateProvider => {
  $stateProvider.state('member.overview', {
    url: '',
    component: 'memberOverviewRoute',
  });
})

/**
 * Route component
 */
.component('memberOverviewRoute', {
  controller: 'memberOverviewCtrl',
  templateUrl: 'member/overview/overview.html',
  bindings: {
    user: '<',
    page: '<',
    filter: '<',
  },
})

Member edit

/**
 * Config
 */
.config($stateProvider => {
  $stateProvider.state('member.edit', {
    url: '/edit/:memberId',
    component: 'memberEditRoute',
    resolve: {
      member(transition, $store) {
        const params = transition.params();
        return $store.members.findById(params.memberId);
      },
    },
  });
})

/**
 * Route component
 */
.component('memberEditRoute', {
  controller: 'memberEditCtrl',
  templateUrl: 'member/edit/edit.html',
  bindings: {
    member: '<',
    transition: '<',
  },
})

For more details on this setup see the ui-router project. Hope this helps.