UI-Router for Angular: возможно ли обновить местоположение без перезагрузки страницы - PullRequest
Новая
       22

UI-Router for Angular: возможно ли обновить местоположение без перезагрузки страницы

2 голосов
/ 02 апреля 2019

Я мигрирую приложение из AngularJs в Angular 7. В старом ui-маршрутизаторе мне удалось обновить местоположение без перезагрузки состояния с помощью приведенного ниже кода. 

        this.syncLocation = function (paramObj) {
            var params = _.clone($state.params);
            params = _.merge(params, paramObj);

            $state.transitionTo($state.current.name, params, {
                location: true,
                notify: false
            });
        };

Однако с новым Angular & UI-Роутер Я не могу это сделать.Не уверен, что это связано со стратегией обнаружения изменений или изменениями самого UI-Router. 

  syncLocation(paramObj) {
    console.log("syncLocation", paramObj);
    let params = _.clone(this.stateService.params);
    params = _.merge(params, paramObj);

    this.stateService.go(this.stateService.current.name, params, {
      reload: false
    });
  }

Я создал plunker , чтобы воспроизвести проблему.Проблема описана в компоненте colors.component.ts ссылка .В этом сланце я не хочу перезагружать страницу, даже если я установил / снял флажок.

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

Любая помощь приветствуется.

1 Ответ

1 голос
/ 04 апреля 2019

Вы можете обновить URL с помощью Location.replaceState()

См .: replaceState ()

Введите Location с помощью di и используйте так: 

constructor(private location: Location) {
...
  private syncLocation(){
    this.location.replaceState(`whatever/state/or/path/you/need`);
  }
}

В Location есть и другие полезные методы, такие как Path, на которые вы можете ссылаться.

...