2016-08-01 60 views
2

在我的Angular2应用程序中,我需要根据此调用的结果从AuthenticationService和引导应用程序调用某个函数。问题是AuthenticationService依赖于来自@ angular/http的HTTP,并且在调用引导函数之前我几乎不知道如何手动构建http服务。在这个问题上接受的答案angular2 bootstrap with data from ajax call(s)描述了我想要完美实现的内容,但不幸的是它给了Angular2以前的版本。在引导Angular2应用程序之前进行AJAX请求

我试图创建HTTP服务是这样的:

let injector = ReflectiveInjector.resolveAndCreate(HTTP_PROVIDERS) 
let http = injector.get(Http); 

,但我得到了XsrfCookieStrategy空引用异常或类似的东西。我相信可以注入一些空的XsrfStrategy,但它似乎更像是一种黑客而不是一个好的解决方案。所以问题是:是否有任何良好的(官方)方式来引导Angular2应用程序,并提供一些类似于上面添加的链接的前期依赖关系。

+1

你可以引导这只是没有Ajax调用的组件,并把它引导你的真实成分......但实际上,你可能只是想你的主要组件程序,因此它可以显示在通话之前也为您的应用程序提供状态,并自行进行通话。 –

+0

Jason,我想我可以在这里看到你的意思,但是有没有任何示例或代码可以说明以这种方式构建的应用程序的想法?我想在引导程序中运行的代码是主要和唯一的入口点,所以即使在路由变成事物之前,它也应该在任何路由(url)处执行。所以我想知道什么是适当的角度来做到这一点。我认为把这段代码放在bootstrap.ts文件中将是一个好主意 –

+0

我还没有找到一个“最好的方法”来做到这一点,但我也有同样的问题。这就是为什么我发布评论而不是答案,可能有更好的方法来做到这一点。你可以做什么它有一个“ParentComponent”,你引导,并进行初始的API调用,只是让它包括你的主要组件ngIf当你的初始调用完成时' –

回答

1
class AuthService { 
    isLoggedIn:BehaviorSubject<boolean> = BehaviorSubject<boolean>(false); 
    checkLogin(http:Http) { 
    return http.get(...) 
    .map(result => result.json()) 
    .do(result => this.isLoggedIn.next(result) 
    } 
} 

bootstrap(AppComponent, [ 
    HTTP_PROVIDERS, 
    AuthService, 
    { provide: APP_INITIALIZER, 
    useFactory: (authService:AuthService) => authService.checkLogin(), 
    deps: [AuthService], 
    multi: true 
    } 
]); 

又见How to pass parameters rendered from backend to angular2 bootstrap method

相关问题