大佬教程收集整理的这篇文章主要介绍了如何在用户注销后重新加载Angular 2应用程序,大佬教程大佬觉得挺不错的,现在分享给大家,也给大家做个参考。
现在,点击退出按钮后,我在订阅方法中得到了服务器的答案(在其中有登录表单),但我不知道如何清理当前应用程序的数据并加载登录表单.
有谁能够帮我?
这是我的主要类AppComponent
import {Component} from 'angular2/core'; import {OnInit} from "angular2/core"; import {Router} from "angular2/router"; import {RouteConfig} from "angular2/router"; import {AuthRouteOutlet} from "./common/directives/auth-router-outlet.directive"; import {AuthservicE} from "./common/services/auth.service"; import {DashboardComponent} from "./common/components/dashboard.component"; @Component({ SELEctor: 'my-app',template: ` <auth-router-outlet></auth-router-outlet> `,directives: [AuthRouteOutlet,DashboardComponent] }) @RouteConfig([ {path: '/dashboard/...',name: 'Dashboard',component: DashboardComponent,useAsDefault: truE} ]) export class AppComponent implements OnInit { constructor( private _router: Router,private _authservice: Authservice ) {} ngOnInit():any { var self = this; this._authservice.getLoggedOutEvent().subscribe(function(next) { //console.log('AppComponent OnEmit: ' + JSON.Stringify(next)); self._router.navigateByUrl('/',truE); }); } }
这是我的服务.我从这里发送退出请求.
import {Injectable,EventEmitter} from 'angular2/core'; import {User} from "../models/user.interface"; import {http} from "angular2/http"; import {ObservablE} from "rxjs/Observable"; import {Headers} from "angular2/http"; @Injectable() export class Authservice { private _userLoggedOut = new EventEmitter<any>(); constructor(private _http: http) {} getLoggedOutEvent(): EventEmitter<any> { return this._userLoggedOut; } logout(): Observable<any>{ return this._http.get('/logout'); } }
import {Component} from "angular2/core"; import {ROUTER_DIRECTIVES,Router} from "angular2/router"; import {AuthservicE} from "../services/auth.service"; @Component({ SELEctor: 'mdm-header-bar',template: ` <header> <nav id="mdm-header-bar" > <ul> <li><a (click)="addComponent()" title="Add component"><i class="fa fa-plus-circle"></i></a></li> <li><a (click)="setTings()" title="SetTings"><i class="fa fa-cog"></i></a></li> <li><a (click)="Help()" title="Help"><i class="fa fa-question-circle"></i></a></li> <li><a (click)="logout()" title="logout"><i class="fa fa-sign-out"></i></a></li> </ul> </nav> </header> `,directives: [ROUTER_DIRECTIVES] }) export class HeaderComponent { constructor(private _authservice: AuthservicE) {} logout() { var self = this; this._authservice.logout() .subscribe(function(next) { self._authservice.getLoggedOutEvent().emit(next); },function(exception){ console.log('HeaderComponent OnException: ' + exception); },function() { console.log('HeaderComponent OnCompleted '); }); } }
当我第一次加载应用程序的主页面时(我将请求发送到localhost:3000),服务器会检查我是否经过身份验证,如果没有,则会将我重定向到localhost:3000 / signin页面.验证后,服务器向我发送主页面:localhost:3000
当我发送注销请求时,服务器注销我并使用localhost:3000 / signin页面发送回答,因为我尚未登录.
我在我的logout(…).subscribe(…)方法中从服务器获取此页面,但我不知道如何卸载当前页面(app)并让浏览器加载此页面.
以上是大佬教程为你收集整理的如何在用户注销后重新加载Angular 2应用程序全部内容,希望文章能够帮你解决如何在用户注销后重新加载Angular 2应用程序所遇到的程序开发问题。
如果觉得大佬教程网站内容还不错,欢迎将大佬教程推荐给程序员好友。
本图文内容来源于网友网络收集整理提供,作为学习参考使用,版权属于原作者。
如您有任何意见或建议可联系处理。小编QQ:384754419,请注明来意。