Архитектура маршрутизации AngularJS, взаимодействие страниц

Question

У меня есть веб-приложение, которое включает в себя мини-SPA, который в основном представляет собой очень сложный рабочий лист. Этот рабочий лист может содержать десятки страниц, каждый из которых содержит десятки полей и ссылки на другие части рабочего листа. В настоящее время архитектура с помощью AngularJS, и каждый щелчок в пределах рабочей таблицы навигации или экранных ссылок вызывает функцию (пример loadWorksheetPage (x)). Эти функции в контроллере вызовут службу REST и загружают правильную информацию о странице.

Недостаток, который у меня есть сейчас, заключается в том, что все происходит на одном URL-адресе. Пользователь может потратить много времени на разные страницы на одном листе. Возможно, они ожидают, что кнопка «Назад» будет работать, но в настоящее время она перенесет их на последнюю страницу, которую они посетили до рабочего листа.

Каковы некоторые рекомендации по применению этого типа? Это мини-SPA, поэтому я не хочу, чтобы angularjs обрабатывали всю маршрутизацию. Я мог бы попытаться обработать маршрутизацию на листе, который я предполагаю (рабочий лист/5/page/7?). Это может быть довольно большим изменением, хотя, и мне придется сначала ударить по MVC-маршруту (рабочий лист/5), за которым следует маршрут angularjs (/ page/7). Не уверен, что это возможно. Я думаю, что когда пользователь нажимает кнопку для загрузки другой страницы на листе, я могу назвать API, который сохраняет историю страниц. Затем я мог бы прервать кнопку «Назад», чтобы перейти к правильной странице.

Answer 1

Я не уверен, что я должен опубликовать это как комментарий или ответ, но здесь. Из звука этого AngularJS ui-router - это то, что вам нужно.

Вы в основном говорите, что у вас есть сложные формы и логика, которые вы хотите сделать модульными на отдельные маршруты, даже лучшие контроллеры и собственные взгляды. Это именно то, что делает u-router.

Я разработал некоторые очень сложные формы с ui-router, это дает вам бесконечно вложенную маршрутизацию, абстрактные состояния (когда вы хотите, чтобы ваши дочерние состояния наследовали некоторые общие функции из базового состояния), несколько именованных видов (несколько видов с их собственные контроллеры в одном состоянии) и вложенная маршрутизация с необязательным URL-адресом, то есть вы можете иметь состояние как дочерний элемент другого состояния, но не хотите показывать URL-адрес дочернего состояния, даже если он активен.

В принципе, ui-router, вероятно, является самым мощным расширением для AngularJS. Это действительно развязывает мощь AngularJS и помогает вам писать еще более динамичные и модульные приложения.

Начало работы здесь:

Get started here

An intro article

In depth Guide

Надеется, что помогло :)