Angular ui-router: Можете ли вы изменить состояние без изменения URL-адреса?

Множество функций вложенных представлений ui-router очень приятно - вы можете легко перейти от одного состояния вашего приложения к другому.

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

Здесь плункер, который показывает, что я имею в виду. Это вилка одного из плунжеров в документации ui-router с двумя незначительными изменениями, отмеченными ниже:

.state('route1', {
        url: "/route", // <---- URL IS SHARED WITH ROUTE2
        views: {
            "viewA": {
                template: "route1.viewA"
            },
            "viewB": {
                template: "route1.viewB"
            }
        }
    })
    .state('route2', {
        url: "/route", // <---- URL IS SHARED WITH ROUTE1
        views: {
            "viewA": {
                template: "route2.viewA"
            },
            "viewB": {
                template: "route2.viewB"
            }
        }
    })

Кажется, что это работает - URL-адрес остается прежним. Опять же, сколько лишней работы здесь сделано? Является ли это одобренным/проверенным использованием?

Было бы неплохо, если бы вы могли опустить url из состояния.

ОБНОВЛЕНИЕ: вы можете опустить URL-адрес из состояния. plunker

Вопрос об обновлении: Является ли это одобренным/проверенным использованием?

Ответы

Ответ 1

Вы можете абсолютно иметь состояние без URL. На самом деле, ни одному из ваших государств не нужны URL-адреса. Это основная часть дизайна. Сказав это, я не буду делать то, что вы сделали выше.

Если вы хотите, чтобы два состояния имели один и тот же URL-адрес, создайте абстрактное родительское состояние, назначьте ему URL-адрес и сделайте из него два состояния (с нет URL-адреса для одного).

Ответ 2

Чтобы добавить к другому ответу, Multiple Named Views не используют URL.

Из документов:

Если вы определяете объект views, ваш шаблон состояния url, шаблон и templateProvider будет проигнорирован. Поэтому в случае, если вам понадобится родительский макет этих представлений, вы можете определить абстрактное состояние, которое содержит шаблон и дочернее состояние в соответствии с состоянием макета, которое содержит объект 'views'.

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

См. Angular Маршрутизация с использованием ui-router для подробного объяснения с примерами.