remove - setattribute id javascript

Forzar la recarga de la plantilla de una directiva

Question

Estoy trabajando en una aplicación AngularJS con varias directivas. Las plantillas de la directiva se almacenan en un archivo html separado. Al editar estas plantillas, mi navegador no detecta ningún cambio después de una recarga y siempre usa una versión en caché. Cualquier otro cambio en el código fuente se detecta y conduce a una recarga.

Supongo que el problema es de alguna manera el $ templateCache que parece ser utilizado por AngularJS al cargar la plantilla.

Lo que encontré en el código fuente de AngularJS 1.0.2 es el siguiente de la línea 4317 que es parte de compileTemplateUrl ():

$http.get(origAsyncDirective.templateUrl, {cache: $templateCache})

Me pregunto si alguien más tuvo este tipo de problema y si hay una manera de decirle a AngularJS cuándo almacenar en caché y cuándo no.

Answer 1

El caché de la plantilla se almacena en su navegador, ya que es una aplicación de JavaScript. En realidad, puede alimentar el $ caché manualmente o detener su navegador para que no guarde en caché las plantillas (ya que parecería que para la producción, el caché no será un problema), utilizando herramientas de desarrollador.

Para forzar la alimentación del caché:

function Main($cache) {
    $cache.data[''first.html''] = {value: ''First template''};
    $cache.data[''second.html''] = {value: ''<b>Second</b> template''};

}

Main.$inject = [''$xhr.cache''];​

Véalo trabajando en este fiddle .

Para evitar que su navegador guarde en caché las plantillas (citadas en esta publicación de Google Groups , sobre este problema, exactamente):

Mi equipo y yo nos encontramos con este mismo problema. Nuestra solución de desarrollo durante el uso de Chrome fue abrir Herramientas de desarrollo y seleccionar el engranaje en la esquina inferior derecha. Luego seleccione Red - Deshabilitar caché.

Esto solucionó todos nuestros problemas de caché parcial / plantilla.

Answer 2

Sé que esta es una vieja pregunta, pero aquí hay una solución más simple, aunque es un truco, funciona para mí y no requiere que hagas nada con $ templateCache.

Cada vez que me encuentro con este problema (lo veo en las plantillas directivas, pero también en los archivos JSON estáticos), agrego un parámetro de consulta al final de la URL que se está cargando, así:

...
templateUrl: "partials/template.html?1",
...

Cada vez que hago un cambio en la plantilla y no se recarga, incremente ese número al final. Como el navegador no sabe si esto podría significar algo especial para el servidor, debería intentar volver a cargar esa URL modificada, ya sea que esté almacenada en la memoria caché o no. Esto también asegurará que el archivo se vuelva a cargar en el entorno de producción.

Answer 3

app.controller(''someCtrl'', function ($scope, $cacheFactory, templateRequest)
{   
    $scope.refreshTemplate = function ()
    {
      var tpl = "<template name>";
      $cacheFactory.get(''templates'').remove(tpl);
      $templateRequest(tpl).then(function ok(){
          console.log("Template "+tpl+" loaded.");
      });
     }
   ...
  }

luego cuando llamas a la función refreshTemplate causas una nueva carga