Html 在url中具有默认页面和参数的Angular 4应用程序

我需要创建一个嵌入iFrame中的web门户

下面是我用来引导门户的代码

路由配置

简化索引.html

“应用程序”组件html

我想从AppComponent中检索这些参数，AppComponent是引导组件

我尝试使用以下解决方案来检索查询参数

但是，由于我有一个“默认”网页和一个路由器出口不在我的html页面的根，这是不起作用的

以下是我遇到的问题：

我不能在路由中同时使用组件和重定向到 定义到我使用的路由。重定向到 应用组件 在根示例中，作者放置了标记。但是当包含在我的应用程序中时，路由器出口无法定位在那里。

---

过了一会儿，多亏了这个链接，我找到了我的应用程序的解决方案

在AppComponent中，我使用以下函数：

function getParameterByName(name: any) {
    const url = window.location.href;
    name = name.replace(/[[]]/g, '\$&');
    const regex = new RegExp('[?&]' + name + '(=([^&#]*)|&|#|$)'), results = regex.exec(url);
    if (!results) {
        return null;
    }
    if (!results[2]) {
        return '';
    }
    return decodeURIComponent(results[2].replace('/+/g', ' '));
}

在AppComponent的ngOnInit中，您可以检索所有需要的参数：

ngOnInit(): void {
  let value1 = getParameterByName('value1');
  let value2 = getParameterByName('value2') || ''; // not mandatory
  // do something with value1 & value 2  
}

import { Component } from '@angular/core';

@Component({
  selector: 'frontend-root',
  templateUrl: './app.component.html',
  styleUrls: ['./app.component.css']
})
export class AppComponent {
  title = 'frontend';
}

<div style="text-align:center">
  <h1>Portal Main Menu</h1>
</div>
<div class="container-fluid">
  <div class="row">
    <div class="col" style="background-color: greenyellow">
      <left-menu></left-menu>
    </div>
    <div class="col-10"  style="background-color: yellow">
      <router-outlet></router-outlet>
    </div>
  </div>
</div>

http://myportal.com/?language=fr&userId=12345

function getParameterByName(name: any) {
    const url = window.location.href;
    name = name.replace(/[[]]/g, '\$&');
    const regex = new RegExp('[?&]' + name + '(=([^&#]*)|&|#|$)'), results = regex.exec(url);
    if (!results) {
        return null;
    }
    if (!results[2]) {
        return '';
    }
    return decodeURIComponent(results[2].replace('/+/g', ' '));
}

ngOnInit(): void {
  let value1 = getParameterByName('value1');
  let value2 = getParameterByName('value2') || ''; // not mandatory
  // do something with value1 & value 2  
}