Angular, UI Router a změna historie prohlížeče rubrika: Programování: JavaScript

4 mjonas4356
položil/-a 13.5.2015
 
upravil/-a 13.5.2015

Ahoj,

mám jednoduchou stránku, kde se zobrazují položky stromové struktury načtením z factory. Po kliknutí na uzel stromečku zavolám v kontroléru $state.go('stromecek', {id: $scope.iduzlu}) tím se mi překreslí položky stromečku a po kliknutí na tlačítko zpět v prohlížeči se dostanu na nadřazenou úroveň. Funguje to v pořádku, ale je to pomalé.

Zkoušel jsem tedy místo zavolání $state.go zavolat jen načtení potřebných dat z factory. Překreslení bylo bleskové. Ale chybí mi ta možnost jít zpět pomocí tlačítka Zpět.

Hledám způsob jak podstrčit prohlížeči nové url a do historie nový záznam. Zkoušel jsem přímo
history.pushState({id: $scope.iduzlu}, '', '/stromecek?id=' + $scope.iduzlu);

nebo doporučovaný způsob na různých diskusích

var noveUrl = "/stromecek?id=" + $scope.iduzlu;
$location.url(noveUrl);
$location.replace();
$window.history.pushState(null, null, $location.absUrl());

Funguje to, ale vždy dojde k stateChangeStart, načtení šablony a nové inicializaci stránky. Poradíte mi někdo funkční řešení? Musí tam být zachována možnost jít zpět pomocí historie prohlížeče.

Děkuji

Komentáře

  • Milan Lempera : Místo řešení následků hledej příčinu (proč je to pomalé, co se tam načítá, co tak dlouho trvá). Pokud chceš nějakou seriózní odpověď, hoď se zdrojáky (v ideální případě jako plunker, nebo jsFiddle) - minimálně konfiguraci stavů UI routeru a controllery, které se tam používají. 15.5.2015
  • mjonas4356 : Úplně jsem zapomněl napsat, že to je pomalé na "obyčejných" tabletech za 3000Kč. Na stolním počítači nebo iPadu je prodleva neměřitelná. 23.6.2015
odkaz Vyřešeno
5 Milan Lempera
odpověděl/-a 22.6.2015

Pokud načítáš data v controlleru (TreeData.get...) tak se ti při každé změně url (nebo změně parametrů v adrese) controller načítá znova.

Co s tím:

  • cache na úrovni service - můžeš mít chytřejší service, která nebude dělat request pokaždé, ale udělá ho jen poprvé a pak bude data cachovat - services jsou v angularu singltony, takže služba ti drží stav po celý běh aplikace, nezávisle na aktivních kontrolerech
  • resolve a podstavy - u UI routeru můžeš stavy zanořovat a využít dědičnosti resolve - rodičovský stav data načte v resolve (bude to trvat déle a nebude zobrazen dokud se data nenačtou) a podstavy se specifičtějším url mohou tuto závislost využít. Pokud se budeš pohybovat z rodiče na potomka, nebo mezi potomky, k přenačítání docházet nebude
  • parametr reloadOnSearch v definici stavu - pokud je false, můžeš měnit search část url aniž by došlo k nové inicializaci controlleru (říkáš routeru, že se o tychle změny budeš starat sám)

Komentáře

  • mjonas4356 : reloadOnSearch to je přesně ono. Moc děkuji 23.6.2015

Pro zobrazení všech 5 odpovědí se prosím přihlaste:

Rychlé přihlášení přes sociální sítě:

Nebo se přihlaste jménem a heslem:

Zadejte prosím svou e-mailovou adresu.
Zadejte své heslo.