$ state.go не меняет адрес

Я использую, Angular.js 1.3, с ui-router. У меня есть 3 страницы, page1.html, page2.html, page3.html.

Когда пользователь нажимает на страницу1, откроется страница 2, но я хочу сохранить состояние прокрутки страницы 1, где пользователь был нажат до щелчка, чтобы после нажатия кнопки «Назад» он приземлился на такое же состояние прокрутки.

Чтобы решить эту проблему, я открыл page2.html над page1.html, в IFRAME, и придавая ей абсолютную позицию для отображения над page1.html, и я использую:

history.pushState({}, '', '/page2.html');

изменить URL. Эта реализация работает нормально.

Теперь, когда пользователь нажимает на ссылку на page2.html, он должен открыть page3.html, как нормальная связь, для которой я использовал:

$state.go("page3")

Проблема в настоящее время государственные chages и PAGE3 .html загружается, но url по-прежнему является /page2.html, url не изменяется.

Я даже пробовал:

history.pushState({}, '', '/page3.html');

Still URL не меняется. Кто-нибудь знает, почему это происходит.

источник

2015-12-29 Rahul Sagore

Я не уверен, что это сработает.но я думаю, вы находитесь в 'Iframe', поэтому его не меняет этот URL. вы можете попробовать 'eval', когда находитесь на стр. 2. может быть 'parent.eval ($ state.go (" page3 "))' что-то вроде этого. –

Можете ли вы разместить JSFiddle? –

Извините, я не могу опубликовать его на jsfiddle. Но да, я могу понять, что ссылка находится в iframe, поэтому она не меняет URL (возможно). Но js-код работает нормально, history.pushState работает (исходный отладчик Js), но он не влияет на URL-адрес. Выскажу больше о iframe. –

Несмотря на то, что решение, которое вы пытаетесь реализовать, очень креативно, я бы выбрал другое направление.

У вас есть различные варианты, все из которых основаны на кэшировании положения прокрутки где-то. Например:

var scrollTopData = {}; 

function changeState (toState) { 
    var currentStateName = $state.current.name; 
    scrollTopData[currentStateName] = window.scrollY; 
    $state.go(toState); 
}

Тогда остается вопрос, что делать с положением прокрутки, которое вы кэшировали. $state.go возвращает обещание, так что решение будет:

var scrollTopData = {}; 

function changeState (toState) { 
    var currentStateName = $state.current.name; 
    scrollTopData[currentStateName] = window.scrollY; 

    $state.go(toState).then(function() { 
     if (toState in scrollTopData) { 
      window.scrollTo(0, scrollTopData[toState]); 
     } 
    }); 
}

В зависимости от реализации, вы можете также использовать ответ asgoth:

Я не использовал его раньше, но имеет угловую $anchorScroll обслуживание. Что касается перезагрузки данных, вы можете кэшировать его с помощью $cacheFactory или хранить данные в более высокой области.

Другим решением является использование stateChangeEvent. Например:

$rootScope.$on('$stateChangeSuccess', 
    function (event, toState, toParams, fromState, fromParams) { 
     // Do magic 
    } 
);

Мой совет будет использовать обещание, возвращенное $state.go.

источник

2015-12-29 14:53:18 pesla

Да, спасибо за информацию. Но мой проект включает в себя бесконечную прокрутку: при первой загрузке API дает 1-й 20-й продукт, затем на прокрутке появляется 20, поэтому, если пользователь прокручивается до 3-го раза и нажимает на элемент, затем нажимает кнопку, API получает вызов от запуска, поэтому сохранение точки прокрутки нецелесообразно, поскольку данные недоступны. В моем текущем решении отображается щелкнутая страница сверху, поэтому удаление его на popstate сохраняет снова хит API и остается в том же положении, что и раньше. –

Ну, эта информация пригодится, прежде чем отвечать :) Во всяком случае, концепция остается прежней, с добавлением: вы можете указать номер страницы, который вы используете, когда загружаете больше статей в хешированный путь. Когда загружается бесконечная страница прокрутки, проверьте номер страницы, загрузите все до этого и прокрутите окно до последней известной позиции прокрутки. – pesla

У вас не может быть изменения в URL-адресе, если вы измените поведение по умолчанию углового. Часть URL-адреса после хеша изменяется автоматически. Вы не изменяя URLs, потому что заставить браузер /somepage.html

попробовать некоторые вещи, как /#somepage.html

запиской хэш (#) добавлен здесь.

источник

2015-12-29 17:15:27

ответ

Смежные вопросы