1

我有一个使用 CLI 创建的 Angular2 应用程序,我需要在不同模式下运行。这些模式需要在查询字符串上传递,因为页面将托管在 IFrame 中。

根据我的阅读,我在访问顶级应用程序中的 RouteParams 时出现问题,因为它们仅在路由组件中可用。

目前,我通过访问 javascript location.search 对象来实现我想要的,但如果可能的话,我更愿意以正确的依赖注入方式执行此操作,以便我可以正确测试。

有人可以告诉我访问参数的正确方法。

@Component({
  selector: 'eox-app',
  providers: [ROUTER_PROVIDERS, RouteParams,
        FilterService,
        LoggingService,
        SpinnerService,
        StateService,
    ],
  templateUrl: 'app/eox.html',
  styleUrls: ['app//eox.css'],
  directives: [ROUTER_DIRECTIVES],
  pipes: []
})
@RouteConfig([

].concat(CliRouteConfig))

export class EoxApp {
    public menuItems = [
        { caption: 'Dashboard', link: ['DashboardRoot'] },
        { caption: 'Fonds', link: ['FundRoot'] },
        { caption: 'Logs', link: ['LogRoot'] },
        { caption: 'API', link: ['ApiRoot'] }
    ];

    public isEmbeded = false;
    constructor(
        private _router: Router,
        private _log: LoggingService,
        private _state: StateService,
        private _routeParams: RouteParams) {

        this.checkForEmbeded();
        let jwt = this.getCookie("eox-token");
        this._state.isAuthenticated = jwt === "123456";

        if(!this._state.isAuthenticated){
            this._log.log("Not authenticated", "Eox vNext");
            this._router.navigate(['DashboardRoot']);
        }
        else {
            this._log.log("Authenticated user", "Eox vNext");
        }
        if(this.isEmbeded && this._state.isAuthenticated)
         {
             this._log.log("Redirect to fundroot", "Eox vNext");
                this._router.navigate(['FundRoot']);
         }
    }

    getCookie(c_name) {
        var i, x, y, ARRcookies = document.cookie.split(';');
        for (i = 0; i < ARRcookies.length; i++) {
            x = ARRcookies[i].substr(0, ARRcookies[i].indexOf('='));
            y = ARRcookies[i].substr(ARRcookies[i].indexOf("=") + 1);
            x = x.replace(/^\s+|\s+$/g, "");
            if (x == c_name) {
                return unescape(y);
            }
        }
    }

    checkForEmbeded() {
        this.isEmbeded = location.search.indexOf("embeded") > 0;
        this._log.log("Embeded mode " + this.isEmbeded, "Eox vNext");
    }
}
4

1 回答 1

0

您可以注入Router(就像您已经做的那样),订阅它,然后访问参数,如下所示:

 constructor(
        private _router: Router,
        private _log: LoggingService,
        private _state: StateService,
        private _routeParams: RouteParams) {
    this._router.subscribe(path => {
      console.debug(this._router.currentInstruction.component.params);
    });
}
于 2016-04-13T13:51:34.320 回答