2014-12-16 4 views
0

Я создаю одностраничное приложение. Я играл с AngularJS. Я немного нервничаю в 2.0, поэтому я открыт для альтернатив Angular. Моя задача состоит в том, что мой сайт имеет иерархическую структуру.Hiearchical Routing in Single Page Application

/Home 
    /About 
    /Blog 
     index.html 
     post1.html 
     post2.html 
     ... 
    /Products 
     index.html 
     product1.html 
     product2.html 
     ... 
    index.html 
    /Contact 
    /Online 
     form.html 
    index.html 

Большинство SPA-приложений, которые я вижу, находятся на одном уровне. Кроме того, я не могу анимировать элементы навигации, связанные с каждым уровнем. Другими словами, когда я нажимаю ссылку на верхнем уровне, я ожидаю, что элементы поднавигации будут анимированы. Другой проблемой является динамическая загрузка содержимого. Я не хочу загружать свое приложение, когда оно загружается изначально, вместо этого я хочу отложить загрузку контента до его необходимости.

Может ли кто-нибудь рекомендовать инфраструктуру SPA, чтобы помочь мне решить эту проблему? Я не думаю, что смогу решить эту проблему с помощью Angular 1.3. Маршрутизатор в Angular 2.0 выглядит как потенциальный вариант. Пока что, это не выглядит жизнеспособным.

Спасибо!

+0

https://github.com/angular-ui/ui-router/wiki/Multiple-Named-Views – coma

+0

Вы всегда можете сделать это с помощью history.pushState, как показано здесь: http://html5demos.com/history –

+0

Я должен уточнить, что вы можете «pushState» изменить URL (по любому пути) и сохранить объект JSON, называемый состоянием. Когда кто-то нажимает кнопку «Назад», будет запущено событие «popstate», которое вы можете прослушать. Атрибут event.state будет иметь ваш объект (который вы используете для перерисовки страницы соответственно). –

ответ

0

Моей задача состоит в том, моем сайте имеет иерархическую структуру

Там нет ничего о SPA или AngularJS, что делает иерархическую структуру сложнее, чем плоская структура 1 уровня. Встроенный угловой маршрутизатор может справиться с этим просто отлично.

Кроме того, я не могу анимировать элементы навигации, связанные с каждым уровнем.

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

Я не хочу загружать свое приложение, когда оно изначально загружается, вместо этого я хочу отложить загрузку контента до его необходимости.

Это также почти наверняка преждевременная оптимизация и неправильное использование инженерных затрат/усилий. Отложить загрузку содержимого (HTML и текст), возможно, но, вероятно, не код (javascript). Разделение приложения на модули с отложенной загрузкой - это приложения со 100 разработчиками и огромными кодовыми базами с несколькими сложными областями (подумайте airbnb, facebook). Шансы на то, что вам реально нужно сделать это, и быть достойными усилиями (затратами/выгодами) для ваших заинтересованных сторон, крайне невелики.

Я не думаю, что я могу решить эту проблему с угловым 1.3

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

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