如何清除模板缓存?

问题描述

在Angular 2中，如何清除模板缓存? Angular 1有很多答案，但2没有答案.

In Angular 2, how do you clear the template cache? There are tons of answers for Angular 1, but none for 2.

我遇到的问题是，当我更改任何组件上由templateUrl引用的html页面的内容时，在浏览器中html页面不会更改，除非我在浏览器中手动导航到templateUrl并点击重新加载.我知道您可以在开发过程中禁用浏览器缓存来解决此问题，但是我担心的是，当我使用Angular 2更新网站时，如果用户在浏览器中缓存了过时的html页面，就会看到该页面.

The issue I am having is that when I change the contents of the html pages referenced by templateUrl on any components, the html pages don't change in the browser until I manually navigate to the templateUrl in the browser and hit reload. I know you can disable the browser cache to solve this during development, but my concern is that users can see an outdated html page if they have it cached in their browser when I go to update a website with Angular 2.

这里是Angular 1的堆栈溢出问题的链接 AngularJS在开发机上禁用部分缓存

Here is a link to the stack overflow questions for Angular 1AngularJS disable partial caching on dev machine

下面是一个摘要，当内容更改时，app.html更新存在问题.

Below is a snippet and I am having issues with app.html updating when its content is changed.

@Component({
    selector: 'photogallery-app',
    templateUrl: './app/app.html',
    directives: [ROUTER_DIRECTIVES, CORE_DIRECTIVES]
})

推荐答案

首先导入TemplateCompiler.

First import the TemplateCompiler.

import { TemplateCompiler } from 'angular2/src/compiler/template_compiler';

接下来将TemplateCompiler注入您的构造函数中.

Next inject the TemplateCompiler in your constructor.

constructor(private _templateCompiler: TemplateCompiler)

最后使用它来清除缓存.请注意，这将清除所有模板.

Finally use that to clear the cache. Note this clears all templates.

this._templateCompiler.clearCache();

更新:Angular 2 Beta 17

首先导入RuntimeCompiler.

First import the RuntimeCompiler.

import { RuntimeCompiler} from 'angular2/src/compiler/runtime_compiler';

接下来将RuntimeCompiler注入您的构造函数中.

Next inject the RuntimeCompiler in your constructor.

constructor(private _runtimeCompiler: RuntimeCompiler)

最后使用它来清除缓存.请注意，这将清除所有模板.

Finally use that to clear the cache. Note this clears all templates.

this._runtimeCompiler.clearCache();

更新:Angular 2 RC 1

首先导入RuntimeCompiler.

First import the RuntimeCompiler.

import { RuntimeCompiler} from '@angular/compiler/src/runtime_compiler';

接下来将RuntimeCompiler注入您的构造函数中.

Next inject the RuntimeCompiler in your constructor.

constructor(private _runtimeCompiler: RuntimeCompiler)

最后使用它来清除缓存.请注意，这将清除所有模板.

Finally use that to clear the cache. Note this clears all templates.

this._runtimeCompiler.clearCache();

更新:Angular 2 RC 4

首先导入RuntimeCompiler.

First import the RuntimeCompiler.

请注意，路径从RC1更改.如果与RC4一起使用，则调用.ClearCache()时，为RC1列出的路径将引发错误.

import { RuntimeCompiler} from '@angular/compiler';

接下来将RuntimeCompiler注入构造函数中

Next inject the RuntimeCompiler in your constructor

constructor(private _runtimeCompiler: RuntimeCompiler)

最后使用它来清除缓存.请注意，这将清除所有模板.

Finally use that to clear the cache. Note this clears all templates.

this._runtimeCompiler.clearCache();

更新:Angular 2.0.0(RTM)

无法完成.我有一个应用程序，它为登录的用户提供一套模板，为未登录的用户提供另一套模板.升级到2.0.0后，我看不到任何方法可以完成相同的任务.虽然我试图找出重新架构应用程序的最佳方法，但我还是选择了这种方法:

It cannot be done. I have an app that serves one set templates for logged in users, and another set for those not logged in. After upgrading to 2.0.0, I can see no way to accomplish the same task. While I try to figure out the best way to re-architect the application, I have resorted to this instead:

location.reload();

可行(但显然会重新加载整个页面).

That works (but obviously reloads the entire page).

这篇关于如何清除模板缓存?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持！