Как предотвратить переход состояния, когда в угловом UI-маршрутизаторе выполняется другой переход?

Question

В моем угловом приложении у меня есть эта проблема. Когда пользователь быстро дважды щелкает ссылку на состояние (ссылка ui-sref), целевое состояние начинает загружаться дважды. Это было бы терпимо, если бы окно состояния не зависало и перестало реагировать на другие изменения состояния. При переходе по другим ссылкам ui-sref URL-адрес изменяется соответственно, выполняются http-вызовы на фоне, но представление останавливается.

Мне нужно знать, как я могу предотвратить любой переход, когда уже есть другой переход, пытающийся выполнить обещание. Я знаю, что могу как-то поработать над магией с $stateChangeStart и event.preventDefault(). Чего я не знаю, так это как разрешить продолжить переход после разрешения блока разрешения и как сопоставить event.preventDefault().

Спасибо за ваше время. Любые советы будут с благодарностью.

Answer 1

У объекта $ state Angular UI Router есть свойство 'transition', которое будет присутствовать, если оно находится в середине активного перехода. Один из вариантов - удалить атрибут ui-sref и использовать вместо него атрибут ng-click. Внутри функции ng-click вы можете вручную проверить наличие объекта перехода, прежде чем вызывать $state.go().

До

HTML:

<a ui-sref="Root.State1">

После

HTML:

<a href="" ng-click="goToStateOne()">

JS:

scope.goToStateOne = function() {
  if (!$state.transition) $state.go('Root.State1');
}