Угловая блочная архитектура, просмотр кеширования

Question

Итак, скажем, у меня есть одностраничное приложение, которое является чем-то вроде блога: есть указательная страница с маршрутом site.com/, где указаны все сообщения и страница «Просмотр», маршрут site.com/post/:post_id. Все данные загружаются асинхронно.

Сейчас все полагались на одном ng-view и маршрутизатор настроен так:

$routeProvider. 
    when('/', { 
    templateUrl: '/partials/index.html', 
    controller: 'Index' 
    }). 
    when('/post/:post_id', { 
    templateUrl: '/partials/post.html', 
    controller: 'Post' 
    }) 

Очевидно, что при переключении между указательным страницы и страницы с постом, виды удаляются из DOM и контроллеры перезагружается.

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

Answer 1

Я бы не стал беспокоиться о повторном рендеринге ... это будет быстро. Пусть Angular беспокоится об этом. Что касается выборки и кэширования шаблонов, я могу думать о двух способах, вы можете сделать это, что позволит избежать AJAX вызовов шаблонов:

1) Положите шаблоны на странице в виде <script> тегов:

<script type="text/ng-template" id="/partials/index.html"> 
    Your template here 
</script> 

<script type="text/ng-template" id="/partials/post.html"> 
    Another template here 
</script> 

Angule загрузит эти шаблоны в $templateCache. Если вы используете серверные технологии, такие как ASP.NET MVC, Rails, Grails или аналогичные, просто создать частичные представления в тех технологиях, которые будут включать ваши шаблоны.

2) Если вам не нравится, поставив <script> тегов на странице, вы можете иметь «строить» шаг компиляции шаблонов и поместить их в кэше шаблона. Результатом будет один гигантский файл JavaScript, содержащий все ваши шаблоны в форме JavaScript. Существует подключаемый модуль GruntJS, который сделает это для вас для ваших угловых шаблонов. Я считаю, что он по существу строит модуль, который будет загружать все шаблоны в $templateCache. Это можно найти здесь: https://github.com/karlgoldstein/grunt-html2js