相关疑难解决方法(0)

如何将从后端渲染的参数传递给angular2 bootstrap方法

有没有办法将后端呈现的参数传递给angular2 bootstrap方法?我想为使用BaseRequestOptions的所有请求设置http标头,并使用后端提供的值.我的main.ts文件看起来像这样:

import { bootstrap } from '@angular/platform-browser-dynamic';
import { AppComponent } from "./app.component.ts";

bootstrap(AppComponent);
Run Code Online (Sandbox Code Playgroud)

我发现如何将这个参数传递给root组件(/sf/answers/2488755531/),但是当我开火bootstrap方法时我需要它......有什么想法吗?

编辑:

webpack.config.js内容:

module.exports = {
  entry: {
    app: "./Scripts/app/main.ts"
  },

  output: {
    filename: "./Scripts/build/[name].js"
  },

  resolve: {
    extensions: ["", ".ts", ".js"]
  },

  module: {
    loaders: [
      {
        test: /\.ts$/,
        loader: 'ts-loader'
      }
    ]
  }
};
Run Code Online (Sandbox Code Playgroud)

javascript angular

71
推荐指数
3
解决办法
4万
查看次数

Angular2 canActivate()调用异步函数

我正在尝试使用Angular2路由器防护来限制对我的应用程序中某些页面的访问.我正在使用Firebase身份验证.为了检查用户是否使用Firebase登录,我必须使用回调调用.subscribe()FirebaseAuth对象.这是守卫的代码:

import { CanActivate, Router, ActivatedRouteSnapshot, RouterStateSnapshot } from '@angular/router';
import { AngularFireAuth } from "angularfire2/angularfire2";
import { Injectable } from "@angular/core";
import { Observable } from "rxjs/Rx";

@Injectable()
export class AuthGuard implements CanActivate {

    constructor(private auth: AngularFireAuth, private router: Router) {}

    canActivate(route:ActivatedRouteSnapshot, state:RouterStateSnapshot):Observable<boolean>|boolean {
        this.auth.subscribe((auth) => {
            if (auth) {
                console.log('authenticated');
                return true;
            }
            console.log('not authenticated');
            this.router.navigateByUrl('/login');
            return false;
        });
    }
}
Run Code Online (Sandbox Code Playgroud)

当导航到对其具有防护的页面时authenticated,或者not authenticated打印到控制台(在等待来自firebase的响应的一些延迟之后).但是,导航永远不会完成.此外,如果我没有登录,我将被重定向到该/login路线.因此,我遇到的问题是return true不向用户显示请求的页面.我假设这是因为我正在使用回调,但我无法弄清楚如何做到这一点.有什么想法吗?

typescript angular2-routing angular

59
推荐指数
7
解决办法
4万
查看次数

在*激活Angular 2中的路径之前解析值*

只要承诺尚未解决,我想阻止访问路由.另外,我想将该promise的返回值传递给路由组件.

SO上的几个帖子建议使用这个OnActivate接口.该文件说:"如果routerOnActivate返回一个承诺,路线变化将等到承诺平息实例化和启动子组件 ".听起来很完美,只有路线仍然会立即激活...(是因为它是Route2 的子组件会等待承诺,而不是Route2组件本身??)

请参阅https://plnkr.co/edit/ipKrOgfRj0vKk8ZejH5v?p=preview.Route2组件实现了OnActivate接口,但是当您单击Route2链接时,会立即激活Route2组件.但是,URL /route2仅在承诺解决后才会更新.(在一个单独的窗口中启动Plunker以查看我的意思.)现在我不太关心URL,在解决promise之前,Route2组件根本不应该实例化.

我的另一个策略是使用@CanActivate装饰器.它更适合我的目的,"路由器调用它来确定组件是否可以实例化为导航的一部分".

这里的问题是如何将数据从@CanActivate装饰器中的promise传递给组件

我看到人们将他们的数据写入next装饰器参数的属性,并nextrouterOnActivate方法的参数中检索它.

例如在next.params(这里):

@CanActivate((next) => {
  return messageService.getMessage()
      .then((message) => {
         next.params.message = message;
         return true;
      });
})
export class MyComponent implements OnActivate {
  routerOnActivate(next) {
    this.message = next.params.message;
  }
}
Run Code Online (Sandbox Code Playgroud)

或者next.routeData.data(在这里).

但是文档 …

angular2-routing angular

5
推荐指数
1
解决办法
9454
查看次数