Наличие дополнительных параметров в качестве родительского состояния в пользовательском интерфейсе

Question

В моем приложении Angular есть несколько состояний, оба из которых имеют myParent в качестве родительского состояния:

var myChild1 = {
  name: 'myChild1',
  parent: 'myParent',
  url: '/mychild1'
  ...
};

var myChild2 = {
  name: 'myChild2',
  parent: 'myParent',
  url: '/mychild2'
  ...
};

и вот myParent

var myParent = {
  name: 'myParent',
  abstract: true,
  url: '/:username/:password',
  resolve: {
    authorized: [
      myService,
      '$stateParams',
      function (myService, $stateParams) {
        console.log($stateParams);

        myService.doSomething() // unrelated
      }
    ]
  }
};

Я хочу получить к нему доступ следующим образом:

/mychild1/superman/superpassword

Тем не менее, это только позволяет мне получить к нему доступ так:

/superman/superpassword/mychild1

Если я сделаю это вторым способом, я не смогу сделать параметры необязательными. Я не думаю, что мое решение является правильным в этом смысле. Как я могу сделать параметры необязательными для всех детей? (Я знаю, что мог бы определить параметры в url для каждого ребенка, но это не очень хорошая практика)

** Кстати, я знаю, что это неправильная аутентификация .. это всего лишь пример, который я использую в данный момент;)

Answer 1

Для доступа к нему, как /mychild1/superman/superpassword, вам нужно иметь оба этих параметра для дочерних состояний, как вы упомянули:

var myChild1 = {
  name: 'myChild1',
  parent: 'myParent',
  url: '/mychild1/:username/:password'
  ...
};

Если вы не хотите писать это несколько раз (такчто вы можете хранить свою логику в одном месте - вы правы в том, что повторяющийся код не является хорошей практикой), вы можете создать себе вспомогательную функцию, например:

function generateChildUrl(name) {
  return name + '/:username/:password';
}

var myChild1 = {
  name: 'myChild1',
  parent: 'myParent',
  url: generateChildUrl('/mychild1')
  ...
};