Обновление представления разрешает все дважды

У меня две проблемы с переходом между состояниями ui-router:

  • При переходе из родительского состояния в дочернее состояние родительское состояние снова разрешается, чего, я думаю, не должно происходить. Это происходит только при первом переходе, во всех остальных случаях все работает должным образом.
  • Если пользователь обновляет страницу с помощью обновления браузера, родительские состояния разрешаются дважды. Я понимаю, что родительское состояние разрешится, если я обновлю дочернее состояние. Но это должно разрешиться один раз. Это разрешается дважды.

Код, который я использую:

$stateProvider
  .state("root.test", {
    abstract: true,
    url     : "/abc",
    template: '<ui-view/>'
  })
.state("root.test.edit", {
    url  : "/:testId",
    views: {
      "@": {
        template  : require('../edit.html'),
        controller: "TestEditController"
      }
    },
    params: {
      testObject: {value: null}
    },
    redirectTo: 'root.test.edit.select',
    resolve: {
      testObject: function () {
        console.info('test object resolved');
      }
    }
  })
.state("root.test.edit.select", {
    url  : "/select",
    views: {
      "[email protected]": {
        template  : require('../select.html'),
        controller: "TestEditSelectController"
      }
    },
    resolve: {
      selectObject: function () {
        console.info('select object resolved');
      },
    }
})
.state("root.test.edit.select.dialogBox", {
    params: {
      testObject: {value:null}
    },
    resolve: {
      testObject: function () {
        console.info('dialog box opens');
      },
    },
    onEnter: ['$state', '$uibModal',
      function ($state, $uibModal) {
        $uibModal.open({
          template  : require('../dialogBox.html'),
          controller: 'DialogBoxController',
          resolve   : {
            testObject: function () {
              return testObject;
            }
          }
        }).result.then(function (testObject) {
          $state.go('root.test.edit.select', { testObject: testObject}, {reload: true});
        }, function () {
          $state.go('root.test.edit.select');
        }
      );
      }]
})

Для первой проблемы, упомянутой выше:

Если я нахожусь в состоянии root.test.edit.select и когда я нажимаю кнопку, чтобы открыть диалоговое окно, которое является состоянием root.test.edit.select.dialogBox, test object resolved -> select object resolved -> dialog box opens, все печатается на консоли, что означает, что все родители разрешены. Но когда я закрываю диалоговое окно и открываю его снова, печатается только dialog box opens, как и должно быть даже при первом открытии диалогового окна.

Для второй проблемы, упомянутой выше:

Если я нахожусь в состоянии root.test.edit.select и обновляю страницу с помощью кнопки браузера, печатается test object resolved -> select object resolved -> test object resolved -> select object resolved, т.е. оба родительских и дочерних объекта разрешаются дважды.

Я проверил свои ошибки, как упомянул здесь, но все в порядке в соответствии с этим сообщением.

Это может быть результатом вашей нестандартной функции redirectTo или наличия $state.$go в вашем обработчике onEnter. По задумке маршрутизатор выполнит решение только один раз и только в том случае, если состояние еще не активно.

JC Ford 26.03.2018 19:54

@JCFord Почему это нестандартный функционал? Вы можете дать мне знать, как это обойти?

Jagrut 27.03.2018 14:36

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

JC Ford 28.03.2018 17:39
Поведение ключевого слова "this" в стрелочной функции в сравнении с нормальной функцией
Поведение ключевого слова "this" в стрелочной функции в сравнении с нормальной функцией
В JavaScript одним из самых запутанных понятий является поведение ключевого слова "this" в стрелочной и обычной функциях.
Концепция локализации и ее применение в приложениях React ⚡️
Концепция локализации и ее применение в приложениях React ⚡️
Локализация - это процесс адаптации приложения к различным языкам и культурным требованиям. Это позволяет пользователям получить опыт, соответствующий...
Улучшение производительности загрузки с помощью Google Tag Manager и атрибута Defer
Улучшение производительности загрузки с помощью Google Tag Manager и атрибута Defer
В настоящее время производительность загрузки веб-сайта имеет решающее значение не только для удобства пользователей, но и для ранжирования в...
Безумие обратных вызовов в javascript [JS]
Безумие обратных вызовов в javascript [JS]
Здравствуйте! Юный падаван 🚀. Присоединяйся ко мне, чтобы разобраться в одной из самых запутанных концепций, когда вы начинаете изучать мир...
Система управления парковками с использованием HTML, CSS и JavaScript
Система управления парковками с использованием HTML, CSS и JavaScript
Веб-сайт по управлению парковками был создан с использованием HTML, CSS и JavaScript. Это простой сайт, ничего вычурного. Основная цель -...
JavaScript Вопросы с множественным выбором и ответы
JavaScript Вопросы с множественным выбором и ответы
Если вы ищете платформу, которая предоставляет вам бесплатный тест JavaScript MCQ (Multiple Choice Questions With Answers) для оценки ваших знаний,...
0
3
92
0

Другие вопросы по теме