Подтвердить что ты не робот

При начальной загрузке моего приложения, почему состояние ui-router не установлено?

Когда я перехожу в свое приложение в https://localhost/my-app/resources/index.html, у меня есть логика, чтобы перейти к моему самоопределяемому состоянию по умолчанию. Однако, когда я хочу перейти непосредственно к определенной части моего приложения (т.е. https://localhost/my-app/resources/index.html#/orders/draft), состояние не будет установлено (и шаблон не загружен в директиву ui-view). Как только эта начальная нагрузка будет выполнена (с установленным по умолчанию набором состояний), я могу делать прямые URL-адреса для моего контента.

Я думаю, что у меня отсутствует базовая концепция того, как вещи загружаются в моем приложении, но я бы ожидал, что состояние будет установлено, поскольку URL-адрес определен в $location.url()

Фрагмент моего кода для обработки состояний при начальной загрузке:

$http.get("Navigation").then(function(response){
    var navigationObjects = response.data,
        directUrl = $location.url(),
        stateName = null;

    scope.availableStates = ims360RouterStateService.getAvailableStates(navigationObjects);
    if (!directUrl)
    {
        scope.updatePrimaryState(scope.availableStates[0]);
    }
    else
    {
        //TODO there probably a better way to do this
        //parsing out the state name, requires that the state name matches the url, this fails when I have a place holder (such as an id to a resource)
        stateName = directUrl.substring(1).replace(/\//g, ".");
        $state.go(stateName);
    }
});

В этом коде я получаю навигационные объекты с сервера, которые определяют, к какому ui-router заявляет, что пользователь имеет доступ. Все мои определенные состояния затем фильтруются до доступных состояний, которые я использую для своей навигации ui.

Кроме того, "updatePrimaryState (...) включает вызов $state.go(...)

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

UPDATE

Я создал плункер, который показывает ожидаемое поведение (http://plnkr.co/edit/m9gQLOZmqaAY88wSc6wC?p=preview). Я попытался дублировать свою проблему, но в простом случае это работает так, как ожидалось. Таким образом, очевидно, что на моем конце есть что-то неправильное, но моя настройка очень похожа на ту, что у плункера. Чтобы проверить сценарий, который я вижу в своем приложении, вам нужно:

  • запустите представление plunker в отдельном окне
  • После проверки того, что состояние установлено, скопируйте и вставьте ссылку в новое окно.
  • В этом новом окне приложение должно перейти непосредственно к состоянию, которое соответствует URL-адресу. В plunker это работает, но в моем приложении это не так.

После загрузки моего приложения загруженное состояние - это пустое состояние с именем: "с URL-адресом" ^".

ОБНОВЛЕНИЕ 2 Покопавшись в код, ищущий разницу, я обнаружил, что при передаче angular "$ locationChangeSuccess" слушатель в ui-router еще не инициализирован. Я нахожу разницу в том, что у нас есть отдельное (многоразовое) приложение для входа, которое сначала загружается, а затем после успешного входа в систему загружает фактическое приложение. В то время, когда фактическое приложение загружается, $locationChangeSuccess уже транслируется, и слушатель ui-router еще не инициализирован, чтобы поймать его.

Моя мысль состояла в том, чтобы ретранслировать событие после того, как мое приложение загрузилось, но у меня все еще возникают проблемы с синхронизацией, когда прослушиватель событий, по-видимому, является последним, что было инициализировано. Сначала я добавил его в блок myApp.run(), но трансляция все еще происходила заранее. Включение широковещательной передачи в главную функцию ссылки на приложение (где работает ui-view), но не уверен, что это хороший подход. Есть ли лучший способ?

4b9b3361

Ответ 1

Я решил, что мне лучше пойти и опубликовать мое второе обновление как решение, которое было для моего случая:

После копания кода, ищущего разницу, я обнаружил, что при передаче angular "$ locationChangeSuccess" слушатель в ui-router еще не инициализирован. Я нахожу разницу в том, что у нас есть отдельное (многоразовое) приложение для входа, которое сначала загружается, а затем после успешного входа в систему загружает фактическое приложение. В то время, когда фактическое приложение загружается, $locationChangeSuccess уже транслируется, и слушатель ui-router еще не инициализирован, чтобы поймать его.

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

Надеюсь, что это поможет.

Ответ 2

Я только что нашел этот http://niclassahlin.com/2014/05/31/kickstarting-angular-ui-router/, и он работает как прелесть для меня.

С помощью следующего кода в вашем приложении app.js вы можете достичь начального состояния:

app.run(['$state', function ($state) {}])