我有几个服务使用Web服务并缓存大量结果.通过缓存我的意思是存储在服务上的变量.当用户注销时,应清除数据.服务如下所示(简化版):
class DataService {
private data;
constructor($http)
{
$http.get(url).then((response) =>
{
this.data = response.data;
});
}
Run Code Online (Sandbox Code Playgroud)
}
哪个是打字稿,但解析成这样的东西:
var DataService = (function () {
function DataService($http) {
var _this = this;
$http.get(url).then(function (response) {
_this.data = response.data;
});
}
return DataService;
})();
Run Code Online (Sandbox Code Playgroud)
$rootScope.on('logout',function(){
this.data = [];
});
Run Code Online (Sandbox Code Playgroud)
但是,当我们有多个服务和控制器时,这是很多代码.我们都知道这个新人会在服务中添加一些新数据,并忘记将其添加到注销序列中.这简直是一种不好的做法.
类似地,数据存储在应用程序各个部分的$ scope中,这也必须清除.范围相当简单,因为控制器的构造函数在每次页面访问时加载,然后将覆盖数据.
一个提议的解决方案是进行刷新,但这会给用户带来可怕的体验.
一种解决方案可能是使角度相信从未创建过服务或完全重新加载角度.
做这个的最好方式是什么?将数据存储在服务变量中是不是很糟糕?
我的Angular 2应用程序具有注销功能.如果我们可以(即document.location.href = '/';),我们希望避免执行页面重新加载,但是注销过程需要重置应用程序,以便当另一个用户登录时,前一个会话中没有剩余数据.
这是我们的main.ts文件:
import 'es6-shim/es6-shim';
import './polyfills';
import { platformBrowserDynamic } from '@angular/platform-browser-dynamic';
import { ComponentRef, enableProdMode } from '@angular/core';
import { environment } from '@environment';
import { AppModule } from './app/app.module';
if (environment.production === true) {
enableProdMode();
}
const init = () => {
platformBrowserDynamic().bootstrapModule(AppModule)
.then(() => (<any>window).appBootstrap && (<any>window).appBootstrap())
.catch(err => console.error(err));
};
init();
platformBrowserDynamic().onDestroy(() => {
init();
});
Run Code Online (Sandbox Code Playgroud)
您可以看到我在销毁应用程序时尝试调用init()方法.我们的user-authentication.service中的logout方法启动destroy:
logout() {
this.destroyAuthToken();
this.setLoggedIn(false);
this.navigateToLogin()
.then(() => {
platformBrowserDynamic().destroy();
});
}
Run Code Online (Sandbox Code Playgroud)
这会出现以下错误:
选择器"app-root"与任何元素都不匹配
任何帮助赞赏.