В Angular, как правильно реализовать маршрут с необязательным параметром, не определяя второй маршрут? - PullRequest
Новая
       54

В Angular, как правильно реализовать маршрут с необязательным параметром, не определяя второй маршрут?

0 голосов
/ 02 мая 2018

Что касается предположения, что на этот вопрос уже дан ответ, этот ответ предлагает обходное решение, которое не решает мой вариант использования.

  • В указанном ответе предлагается использовать 2 маршрута, поэтому в заголовке моего вопроса указывается без указания второго маршрута Использование 2 маршрутов создает проблемную историю браузера.

  • Если этого можно избежать, я не хочу использовать параметр строки запроса или хэш.

  • Я не хочу использовать дочерний маршрут, потому что для этого потребуется использование вторичного маршрутизатора, что увеличит уровень сложности моего приложения, которого, я считаю, можно избежать.

Мой маршрут имеет 2 параметра, один из которых является необязательным. Это ленивый загруженный маршрут, но я предполагаю, что это не должно иметь значения, поскольку это относится к моему вопросу. Если это имеет значение, пожалуйста, дайте мне знать.

Маршрут: 

{ path: 'list/:name/:type', loadChildren: './list/list.module#ListModule'},

Параметр :name требуется для правильной загрузки этого маршрута, но параметр :type является необязательным.

Я попытался определить 2 отдельных маршрута и указать оба на один и тот же компонент, один с параметром, а другой без него, но в моем случае это не рабочее решение.

Мне бы хотелось, чтобы история браузера была правильной и отражала добавление или обновление необязательного параметра :type через взаимодействие с пользователем без необходимости перехода на другой маршрут, вызывающий перезагрузку компонента.

Итак, проблема в исходной записи маршрута. Как только параметр :type был определен в первый раз, последующие изменения не потребуют изменения маршрута.

Я хотел бы спросить, в частности, можно ли определить необязательный параметр для маршрута в Angular?

Или, в качестве решения этой проблемы, возможно ли обновить маршрут / URL после создания экземпляра маршрута без запуска навигации?

1 Ответ

0 голосов
/ 02 мая 2018

Как оказалось, Angular действительно предлагает способ использования необязательных параметров.

Хотя это по-прежнему не решает тот факт, что при первоначальной реализации без данный параметр будет все же требовать навигации для достижения того же маршрута с параметром подарок. Я пытался избежать перезагрузки в браузере.

Спасибо @ johnsharpe за указание на это, я не знаю, как я пропустил это. Предполагаемое использование решает ситуации, требующие более сложных структур url, но это правильный ответ.

Угловые документы по необязательным параметрам

После долгих размышлений я также наткнулся на это видео Угловое руководство по параметризованным маршрутам , которое на самом деле охватывает мой вариант использования , как определить необязательный параметр в Angular, и почему вам может понадобиться использовать один для того, чтобы поддерживать функциональную навигацию браузера. Ответ о том, что Веселин Давыдов , упомянутый выше, создает проблемную историю браузера. Как? Причина объясняется примерно через 11 минут видео.

Чтобы реализовать параметр маршрута как необязательный, вы сначала определяете маршрут без дополнительного параметра. Используя мой случай в качестве примера, я определяю свой маршрут только с обязательным параметром :name: 

{ path: 'list/:name', loadChildren: './list/list.module#ListModule'},

И затем при переходе на этот маршрут из моего приложения я могу определить необязательный параметр :type, как, например, используя объект с парами ключ / значение: 

this.router.navigate['list', name, {type:value}];

вместо этого: 

this.router.navigate['list', name, type];

Этот подход использует матричную нотацию URL. Полученный URL имеет точку с запятой и выглядит так: 

mysite.com/list;type=value

При совместном использовании и / или перезагрузке этого результирующего URL-адреса Angular выберет параметр матрицы и сделает его доступным в качестве параметра маршрута.

По иронии судьбы, использование параметра матрицы имеет и другие последствия, и как таковой это может быть нецелесообразным подходом. Подробнее см. вопрос / ответ .

Итак, вы можете подумать, как я, тогда какая разница? почему бы просто не использовать вместо этого параметр строки запроса? см. Различие между матрицей и запросом

...