Angular - создайте объект JSON для хранения данных, связанных с каждым маршрутом

Question

Я хочу создать объект JSON, содержащий текст справки для каждого маршрута в приложении Angular 6.

let helpRoutes = {
 'wizard/{some_id}/step1': 'This is help content for step 1',
 'wizard/{some_id}/step2': 'This is help content for step 2',
 'user/details/{some_id}/tab1': 'This is help content for user details with activated tab 1'
 'user/details/{some_id}/tab2': 'This is help content for user details with activated tab 2'
}

Так что, если я хочу получить доступ к справке для шага 1 для любого screen_id, я должен получить его с:

helpRoutes['wizard-fa/123456/step4'];

Выше код явно неверен и дает мне «неопределенное» ивот почему я задал этот вопрос.

Можем ли мы достичь того, что я хотел сделать, используя пару ключ-значение JSON?

Если да, то как.Если нет, каковы альтернативы?

Спасибо.

Answer 1

Вместо

let helpRoutes = {
 'wizard/{screen_id}/step1': 'This is help content for step 1',
 'wizard/{screen_id}/step2': 'This is help content for step 2'
}

вы можете написать его как

let helpRoutes = {
 'step1': 'This is help content for step 1',
 'step2': 'This is help content for step 2'
}

Извлечь последнее слово с помощью разделителя / и получить данные из json.Например, если для маршрута указано wizard/1234/step1, получите последнее слово step1, а затем help[step1].

. Это может быть один подход.

Answer 2

да, вы можете достичь этого, назначив идентификатор экрана перед вызовом объекта helproute. Если вы хотите, чтобы screen_id был динамическим, вам необходимо сначала присвоить значение объекту. См. Пример,

   let helpRoutes = {};
    for(let screen_id=0;screen_id<10;screen_id++){
        helpRoutes[`wizard/${screen_id}/step1`] =`This is help content for step ${screen_id}`;
    }

После назначения значения справочной службы вы можете получить значение.

helpRoutes['wizard/2/step1']

Answer 3

В ваши маршруты вы можете добавить статические данные

{ path: 'my-route', component: MyComponent, data: {
  help: 'This is help content for component'
}}

И вы можете использовать их с экземпляром ActivatedRoute

constructor(
  route: ActivatedRoute
) {
  console.log(route.data);
}