2017-01-30 4 views
0

Я использовал кеш: false в моем состоянии, чтобы избежать кэширования шаблонов (html view), как показано ниже.Альтернативный вариант для кеша: false в состоянии провайдера

.state('index.project_setup', { 
     url: '/:customerTag/project-setup', 
     templateUrl: 'app/views/common/customer/projects/setup_projects_wizard.html', 
     data: { pageTitle: 'Project Setup' }, 
     cache: false 
    }) 

После внесения изменений в файл html иногда мне нужно жестко обновить страницу, а не просто перезагружать. Так это то, чего я не вижу, или есть способ сделать это?

ответ

0

Существует различие между кэшированием угловых шаблонов и кешированием браузера. Когда Angular загружает шаблон в первый раз, он будет запускать запрос AJAX для этого шаблона, а затем сохранить HTMLin в службе с именем $templateCache, поэтому, если тот же самый шаблон потребуется снова, он пропустит вызов AJAX и будет использовать HTML хранится в $templateCache.

После того, как вы обновили свою страницу, инициализируется услуга $templateCache (так как все JS инициализированы), и все кэшированные HTML-файлы исчезли, поэтому снова, когда Angular потребует HTML-файл для шаблона, он вызовет вызов AJAX в первый раз, сохраните его в $templateCache, а затем используйте кешированный HTML здесь.

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

Так позволяет сказать, что нам нужен шаблон с именем x.html, что будет происходить следующий псевдо-код:

if (x.html exists in $templateCache) 
    return x.html from $templateCache 
else 
    AngularJS perform HTTP GET for x.html 
    if (browser has x.html cached version) 
     return x.html from browser cache and don't fire HTTP request 
    else 
     fire HTTP request for x.html and return the result 

Это путь вы должны «жесткий Reload» шаблоны каждый раз в то время.

Мое решение для развития, прикрепляет изменяющуюся строку запроса в шаблон URL, например:

.state('index.project_setup', { 
     url: '/:customerTag/project-setup', 
     templateUrl: 'app/views/common/customer/projects/setup_projects_wizard.html?v=' + Date.now(), 
     data: { pageTitle: 'Project Setup' }, 
     cache: false 
    }) 

Это простой трюк, который заставляет браузер всегда извлечь файл HTML, поскольку строка запроса никогда не будет одинаковым (ну, это будет одинаково в течение 1 миллисекунды :)), поэтому каждый раз, когда браузер получит HTTP-запрос для этого HTML, он не будет соответствовать предыдущим запросам и не будет использовать кеш.

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